Hacker News Reader

The whole CSS in JS thing is so backwards. I use React a lot and I love it, but styles stay in a css file structured using BEM. It works.

View on HN

I thought the same thing until you start to think in terms of “constraint-based components”, which are more easily done in CSS-in-JS. Styling is done by passing properties to a component, e.g. <Heading color=“primary” />, and only the developer building the primitive component needs to worry about styling. You end up being able to rapidly develop interfaces that match the designs.

If I understand correctly you can still do that, just the underlying component will be adding/removing a CSS class instead of injecting the actual styles. I usually use the classnames library to help with this but obviously not a requirement (https://www.npmjs.com/package/circular-dependency-plugin) I find it's also easier to test for the presence of css classnames based on the provided props than it is to test for the presence of mutiple style rules.

Reply on news.ycombinator.com