The Lonely and Dark Road to Styling in React
summary
Compares four concrete approaches: plain CSS (fast to mock, naming pain), preprocessors like Sass (variables, nesting, extra build deps), CSS Modules (file-scoped hashed class names, supported by create-react-app) and CSS-in-JS (styled-components/emotion: props-driven styles, theming, but SSR complications). Shows actual tooling used — create-react-app, node-sass, postcss, Razzle, CodeSandbox — and demos how CSS Modules supported by create-react-app and server-side rendering via collected style tags work in practice.
AI-written summary · about
chapters (8)
- 0:00Start
- 3:01LET'S WALK THE ALLEY TOGETHER
- 3:17THE DARK AND LONELY ROAD TO STYLING IN REACT
- 5:11NEVER FORGET THAT 1500 LINES CSS FILE
- 11:55CSS MODULES
- 14:44AUTOPREFIXER COMES BY DEFAULT
- 20:36SERVER SIDE RENDERING?
- 27:49USE WHAT MAKES YOU CODE FASTER AND BETTER
related talks
31mThe Lonely and Dark Road to Styling in React
34mCSS in React
25mStyled and SASSy: Choosing the Right React Styling Solution
29mHow to style in React and not lose friends
21mStyling your CSS with Reason
07mReact Components and How To Style Them
27mStyles & SASSy: Choosing the Right React Styling Solution
44mWriting styles for React components