A Frameworkless Approach to Building Your Single Page Application
summary
Presents a frameworkless approach to building single‑page applications by choosing frameworks based on how specific the design system is and the software’s expected lifetime. Shows concrete tools: Sketch for design, a governance channel for the pattern library, and Web Components using connectedCallback and observedAttributes; demonstrates a reusable number‑input component that keeps formatting and focus behavior working in both React and Angular. Reports tradeoffs (development velocity vs component specificity), measurable technical‑debt risk, and when to use Material, CSS‑only, or composite strategies.
AI-written summary · about
chapters (11)
- 0:00Introduction
- 2:12Tech choices
- 5:03Design system foundation
- 8:08Design principles
- 10:43Governance and culture
- 12:25Pattern library
- 14:14Framework vs frameworkless
- 15:24Framework pitfalls
- 16:49Software evolution
- 18:16Web components alternative
- 20:23Technical choices summary
related talks
51mBuilding Complex Apps with plain Web Components
36mBuilding framework agnostic UI with Web Components
58mThe agony of choice among Single Page Application frameworks
35mDesign system - From a Developer Point-of-View
56mThe Web, Its Frameworks and Its Standards: Deconstruct to (Re?)Construct
21mDesign Systems 101: The Developer Approach to Better Frontends
25mCreating the Ultimate Front End UI for a Single Page Application
43mRefactoring to a Single Page Application