Introduction

2022-11-30

Welcome to Web Components bookmarks β€” the curated collection of up-to-date Web Components guides and resources! I'm excited to finally share this project publicly, with lots of content to be added every day in the upcoming weeks, so stay tuned. In the end of December, I'll make it open source.

At the time of writing this project is still in development. You can track the progress at Mastodon by following the #WebComponentsAdvent hashtag. And by the way, boosts are highly welcome! Feel free to also follow me on Twitter if you are into that kind of thing, as I'll post there too, for more visibility.

When I started to learn Web Components in early 2016, there was no such website. The initial wave of hype that began in 2013 has passed, and Web Components were undergoing quite a deep trough of disillusionment. As a result of moving from the Chrome-only V0 specs to Custom Elements and Shadow DOM V1 with some significant API changes, numerous previously posted articles became obsolete.

For example, the Web Components the Right Way "awesome list" created by Mateus Ortiz was largely outdated. I wanted to contribute and submitted a few PRs to align it with the rapidly evolving standards. Two years later, I became a maintainer of this project, and I tried to do my best to keep it in a good shape while adding more content. But the problem is, not everyone likes these longs READMEs.

Today it's clear that Web Components are here to stay. In my opinion, they finally reached the plateau of productivity. Front-end developers use them more often (although not as much as JS frameworks like React and Vue). But there are still some notable gaps to fill concerning the ecosystem.

There are ongoing efforts related to Web Components. In particular, there is active development by the Lit team on rebuilding the webcomponents.org project. Also, since the last year, we've seen a lot of activity from the Web Components Community Group at W3C. But in this case, more is better.

This project is really simple: it's just a static website with hundreds of links to other resources that I carefully selected, grouped by topics. Most of the articles are from 2019 or newer: by then, Web Components APIs landed in all modern browsers. However, one thing that I especially enjoy about web standards is that even some examples from 2017 are still relevant and worth checking out.

While I've been working on this single-handedly, I would like to say thank you to everyone who has been advocating for Web Components over the last couple of years. Your great tutorials, guides, and tools have helped me so much! This collection wouldn't be possible without your work. And I will dedicate the final day of this advent series to celebrating all the folks within the community.

One last thing: let me also introduce myself. I'm Serhii Kulykov, a software engineer from Ukraine. As you might have heard, there is an ongoing war and the russian invasion of my country. And I'm writing these words just one week after the huge blackout caused by russian missile strikes, so this project may encounter challenges. If you want to support my work, please support Ukraine instead.

If you have any feedback or ideas on how to improve this project, let's get in touch! My hope is that this website will help anyone interested in Web Components enjoy working with them as much as I do.