Building Better Components — A Journey to a More Resilient Frontend
summary
Code samples come from live production repositories and use React + TypeScript. The talk shows concrete rules: replace boolean-bloat with categorical union props, treat HTML attrs separately and extend native HTML attributes so inputs and buttons accept children and real events, and standardize names/defaults (sizes default to medium) across ~50–60 components. It demonstrates a working component store hook (usePopoverMenu) that centralizes state, ARIA, placement and works across files, and reports measurable upticks in library adoption.
AI-written summary · about
chapters (7)
- 0:00Introduction and goals
- 5:18Grouping similar props
- 10:33Data gate model
- 14:52Establishing consistency
- 24:21Avoiding HTML reinvention
- 38:01Using component stores
- 46:56Recap and conclusion
related talks
49mBuilding Better Components - A Journey to a More Resilient Frontend
24mDesigning Components for Fun, Profit and Sanity
44mA Practical Guide for Crafting Resilient UI Components
44mWriting good components
34mSecrets of building robust UI components
46mBuilding Reusable Components ... That Are Actually Reusable
38mWriting highly reusable React components
35mAdvanced patterns in building React Components