Build next gen web apps using web components

on YouTube ↗02h 32m

" summary

Workshop shows how to build functioning examples: a HelloWorld, a to‑do app and a chat app, first with vanilla JS and then with lit-element; code demos attach Shadow DOM, templates, custom elements, lifecycle callbacks and slots and wire up events and attribute/property reflection. It demonstrates bundling, polyfills for older browsers, npm scripts and simple integration into React/Angular/Vue projects, and includes a repo to clone so the examples can be run and inspected end to end.

AI-written summary · about

" chapters (9)

1. 0:00Start
2. 1:23Web Components
3. 3:53Goals
4. 4:24Browser Support
5. 5:39Custom Elements
6. 6:43Shadow DOM
7. 7:32HTML Templates
8. 8:55Constructor
9. 10:42Registering the element

" related talks

• 46mFuture-proof your Web Apps with Web Components and LitElementKito Mann · RVA JavaScript Conf 2019
• 53mFuture-proof your Web Apps with Web Components and LitElementKito Mann · Developer Summit 2020
• 32m"Future-proof your Web Apps with Web Components and Lit"Kito Mann · Frontrunners 2025
• 36mWeb components - A whirlwind tour thru the future of the webMartin Naumann · FutureJS 2014
• 44mWeb Components An Introduction to the FutureTobias Ljungstrom · NDC Oslo 2021
• 51mBuilding web applications with Web ComponentsMartin Splitt · Voxxed Days Ticino 2017
• 41mComponents Approach to Building Web AppsVinci Rufus · Meta Refresh 2015
• 36mBuilding framework agnostic UI with Web ComponentsPiotr Nalepa · 4Developers Katowice 2019