What are web components?

Web components are, by definition;

"a set of web platform APIs that allow you to create new custom, reusable, encapsulated HTML tags to use in web pages and web apps"

-Webcomponents.org introduction

In terms of business, this means that the development team could create each component of a website once and then anyone else who needs to use it can do so with ease.

For example, let's say we are building a site for an organization. This organization prioritizes consistency (as it should) and therefore wants certain components of their websites to be uniform; the header, footer, menus, and any other reusable components.

Brigham Young University has a great example of what an organization's codebase should look like here.

With each component being built and modified as needed, websites can be set up and deployed exponentially faster and cheaper than traditional methods and short-lived JS frameworks. Web components are here to stay.

-Webcomponents.org

If you're looking for a more in-depth look into getting started with web components, check out this 8 part blog series by Benny Powers.

So, who's using them?

As mentioned before, Brigham Young University:

Adobe

Adobe has been a big proponent in expanding the open source space for web components. They even have a playground space for you to try out:

-Adobe web components playground

YouTube

YouTube uses tons of web components throughout their site. This is thanks in part to Google being a huge driving force in making web components the new standard.

If you want to watch a video explanation, I did make one, but bare with me as I was feeling under the weather: