Vanilla Web: You Don't Need that Library
summary
A small mobile PWA coffee store is built with plain HTML/CSS/JS, using Web Components plus templates and Shadow DOM for encapsulation, a tiny router based on the History API for client-side routing, and a proxy-based reactive state so the cart badge updates automatically across pages. The app is open source, served as static files (Eleventy used in the workflow) and hits ~98 Lighthouse performance; service workers add offline/installable PWA behavior.
AI-written summary · about
chapters (17)
- 0:00Vanilla web development intro
- 5:15Modern apps overcomplicate
- 7:23Vanilla JS and web components
- 12:28Fears about vanilla JS
- 16:23Semantic HTML and vanilla CSS
- 21:05CSS without JS libraries
- 23:56Client-side routing vanilla
- 28:12Reusable components standards
- 33:11Custom elements lifecycle
- 36:25Shadow DOM templates
- 43:15Reactive vanilla JS
- 47:13Web apps power AI
- 50:24Baseline cross-browser
- 52:32Live demo vanilla app
- 55:24Web apps history PWAs
- 58:35Balancing tools tech fandom
- 1:00:21Key takeaways resources
related talks
30mVanilla JS: You Might Not Need that Library
42mVanilla Web: You Don't Need that Library
41mThe Future is Now: Web Apps Productivity without Frameworks#slideless.
47mnative-like PWAs in Web Components live-code
45mVanilla JS 2018
51mWeb Components without Frameworks: Productivity, Speed & Independence
23mPros Do Vanilla - A Loosely Coupled Front-End
01h 02mWeb Apps without Frameworks