CSS in a Components World
summary
Claims that CSS can be extended into a typed, component-aware layer and demonstrates a working preprocessor called Styleball preprocessor that uses a .st.css typed syntax to declare components, parts and states. Shows integrations: VS Code completions, webpack and React plugins, server rendering strategies and runtime minimization. Cites a one-in-five developer adoption stat for CSS-in-JS, reports Styleball is open source on GitHub, currently dogfooding in Wix back-office apps and under beta testing with the core features implemented.
AI-written summary · about
chapters (18)
- 0:00Start
- 1:05In the Beginning...
- 2:50CSS Stylesheets
- 3:55Preprocessors
- 4:19CSS Modules
- 7:59Target Element
- 8:56Semantic elements
- 10:23Data Attribute?
- 12:09Typed CSS
- 13:38Define the Gallery Class
- 14:05Import & Extend
- 14:31Styling the Gallery
- 14:52Define the Gallery Internals
- 15:59Quick Recap
- 16:49State of Stylable
- 17:32Up Ahead...
- 21:18Import Reveal
- 22:29Style Reveal Progress Inner Bar
related talks
45mCSS-in-JS: FTW
28mSee the Past, Present, and Future of CSS-in-JS
23mCSS-in-JS
23mThe road to styled components: CSS in component-based systems
26mCSS in JS: The Good & The Bad Parts
25mCSS is dead, long live CSS but in modules, please!
21mStyling your CSS with Reason
57mPanel Discussion - Styling in CSS