Future-proof your Web Apps with Web Components and LitElement

on YouTube ↗46m

" summary

Argues that using Web Components plus LitElement and lit-html makes apps faster, smaller, and browser-native with long-term compatibility; demos a TypeScript app that fetches GitHub repos and a separate filter component built with shadow DOM, property/attribute binding, converters, slots and decorators, served via ES dev server. Notes Edge legacy lacks shadow DOM, shows the composed components communicate with events and the demo works end-to-end.

AI-written summary · about

" chapters (7)

1. 0:00Introduction and context
2. 3:30Web components standards
3. 12:30Introduction to lit-element
4. 20:02Setting up the project
5. 21:48Developing a github app
6. 35:31Advanced component features
7. 43:39Resources and conclusion

" related talks

• 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
• 02h 32mBuild next gen web apps using web componentsSumit Chaudhari · JSConf.Asia 2019
• 37mUsing Lit and Web Components to build Single-Page ApplicationsMichele Stieven · jsday 2022
• 41mComponents Approach to Building Web AppsVinci Rufus · Meta Refresh 2015
• 51mBuilding web applications with Web ComponentsMartin Splitt · Voxxed Days Ticino 2017
• 37mThe world of Web ComponentsNishu Goel · AzConf 2020
• 34mWeb Components & Micro Apps: Angular, React & Vue peacefully united?Manfred Steyer · iJS 2018