The UI Component Library You Always Dreamed Of
summary
Overview of how React community practices have produced practical UI component libraries; compares React’s simple, effective tools for building reusable UI components with other approaches like BEM, Polymer and Angular, and presents concrete experience and recommendations for designing easy-to-use component libraries.
AI-written summary · about
chapters (32)
- 0:00Introduction
- 1:11Speaker background
- 2:17Design unification problem
- 4:03Live styles and components
- 6:10Talk format and structure
- 7:18Component technology choice
- 8:21Why React for components
- 10:33Popular component libraries
- 12:00Good component requirements
- 14:27Installing and using Material UI
- 16:59React component advantages
- 17:25Styling in Material UI
- 18:52Alternative styling approaches
- 19:34React Styleguidist tool
- 22:25Storybook tool
- 23:54Using Storybook
- 25:47Dev environment setup
- 27:10First component steps
- 28:15Integration with Source and Styleguidist
- 29:16CSS styling work
- 30:20GSS project for styles
- 31:27CSS Modules and Styled Components
- 32:30Component typing in React
- 33:56Component documentation
- 35:24Benefits for designers and devs
- 36:32Dev workstations
- 37:36Focus tools
- 38:19Component code generators
- 39:43Testing and debugging ease
- 40:48React Decart project
- 42:54Community and future
- 43:14Q&A
related talks
44mBest Practices on building a UI component library for your company
43mHow to build your reusable UI component library like a pro
23mBest Practices for reusable UI components
08mBuilding a Custom Component Library – Fast - TJ VanToll
25mFrom Design Systems to Component Libraries
46mBuilding Reusable Components ... That Are Actually Reusable
32mUI Development Made Simple
24mCase Study: Creating a Component Library in React JS