Welcome to the world of Web Components.

Web Components, as the name indicates, are components that can be reused across different sections of a website by keeping encapsulation in check. They can even be published on the web, and be used by another site with the help of a simple import. This book covers all there is to know about Web Components. What they are made up of, how they can be used and in what scenarios. The book also covers wide variety of moderate and advanced level concepts such as good practices and integrating Web Components with other technologies.

In this chapter, we will talk about what Web Components are and how we can identify them while browsing various sites. We will also be talking about the specifications that make up Web Components along with detailed examples. You will be able to understand what custom elements are and how you can create one on your own. You will be able to encapsulate your Web Components with the help of a shadow DOM, and you will be able to use templates to achieve reusability.

While this chapter talks only about the basics of Web Components, by the end of this chapter you will be able to create your own Web Components from scratch, and understand the specifications associated with them.

In this chapter, we will cover the following topics:

• Web Components
• Web Component specifications