Envato Tuts+ Tutorial: How to Create a Web Component for Embedding YouTube Videos
In the previous tutorial “How to “Lazy Load” Embedded YouTube Videos” we looked into how to load a Youtube video only when a user clicks it. This in turn helps our web page load a bit faster, especially if there it contains multiple Youtube videos.
If you followed the tutorial thoroughly, you’ll have seen that we had to add a couple of div elements, along with the classes, the styles, and the scripts to get it working.
Having to add all this each time is not the most convenient approach; what if we could replace all this by instead using an out-of-the-box element, like instead? That’s exactly what we are going to do in this tutorial; we are going to create a fully-functioning custom HTML element using “Web Components”.