WebExpo

April 20, 2023
Prague, Czech Republic
https://webexpo.net

Extending HTML with Web Components

The official HTML specification features over 100 native elements you can use to create awesome websites or applications. But what if these are not enough, or you want to make your own implementation of a video tag?

JavaScript frameworks like Vue, Angular and React offer the tools for creating components, but they are not interchangeable. You will need to build them for every framework, which is cumbersome for organizations with various tech stacks.

Web Components are framework agnostic. They can be reused in any frontend project, whether you use a JavaScript framework or not. Stop rewriting components in the JS flavor of the month.

In this talk, Rowdy will demonstrate how to create Web Components by implementing custom elements, shadow DOM and HTML templates. He will also show you how to use your new and shiny Web Component with your beloved JS framework.

Demo code is available at :
https://github.com/rowdyrabouw/web-components-examples

Slides