Forking Styled Components

https://github.com/sanity-io/styled-components-last-resort/blob/main/README.md

by coloneltcb • 10 months ago

32 7 10 months ago

blabla1224• 10 months ago

For the rich SPA, styled-components is one of the best things that happened to the Web (CSS-in-JS)

k3liutZu• 10 months ago

One of the main "problems" we solved with adopting styled-components back in 2016 was styles colocation where more junior members managed to create a several thousand line CSS file with a mess of selectors which we couldn't safely figure out which is used where.

My current plan is to transition to CSS Modules which should allow preserving most (if not all) of the current styled-components DX and advantages.

user1999919• 10 months ago

limitless paper in a paperless world

lioeters• 10 months ago

The CSS-in-JS approach has always felt to me like too many steps removed from actual CSS. I tried Styled Components long time ago and didn't like it. I prefer CSS Modules, and Sass still (though trying to move away due to breaking changes in next major version). And use JS to only add/remove classes.

Interesting, in their list of long-term CSS-in-JS alternatives, they include Tailwind. I see it as CSS in HTML/JSX class attributes. Then I suppose HTMX is JS in HTML.

A new one I hadn't heard of, React Strict DOM. Apparently it's a cross-platform styling library for React Native.

https://facebook.github.io/react-strict-dom/

React Strict DOM lets you create user interfaces that look and feel right on every platform. Web apps are rendered to HTML and rely on static CSS. Native apps look and feel native because the UI is truly native, not a web view.

Yeah, for this use case, I can appreciate the value of having styling primitives in JSX. It's not CSS, but a higher abstraction that includes web and platform-native styles.

floydnoel• 10 months ago

Tailwind. I see it as CSS in HTML/JSX class attributes.

In React, the HTML/JSX is embedded in JS. So I think it could be viewed as both!

madeofpalk• 10 months ago

"[Too many] steps removed from actual CSS" is the whole point. From what I've seen at multiple productive companies is that people just aren't good at writing CSS.

People who are really good at it are few and far between, so CSS-in-JS is an attempt to scale out styling across a large team that lacks widespread expertise in it.

recursive• 10 months ago

Being really good with italics seems like a higher bar than we're demanding for CSS-in-JS. It's not that hard to get a baseline level of competence in CSS. If you learned react, you can definitely get productive with CSS. I'm not sure why CSS has developed this aura of arcane mysticism.

Forking Styled Components

Related Stories