Member-only story
Skills you should have before using Web Components
When I started the journey of using Web Components, I was already familiar with the concept and the benefits of using them, but I never had the chance to get into details and actually implement them. I started looking for guidance because I wanted to see how others are using it, and if maybe they shared some best practices.
All the articles that I found about WebComponents said that there is no actual WebComponents API; it is more like a collection of new browser APIs that can be used together. Most of them referenced only 3 of them: Custom Elements, Templates, and ShadowDom.
After I started implementing WebComponents in my first project, I noticed that those articles were not wrong, but they were incomplete. There are a few more skills you need to learn before you go full speed.
Here is my complete list of those skills. I imagine that you are already familiar with some of them. By the way, I will not fully describe the details of each one of them but feel free to access the links to the official documentation.
1. Custom Elements
I would say that this is the most important API because it allows you to extend the HTML5 native tag collection with your own tags. (more info)