Why We Use Styled Components – Hacker Noon

Why We Use Styled Components:  by @_alanbsmith #JavaScript #ReactJS

  • That’s not what CSS-in-JS is about regardless of the hype.Styled Components Isn’t the Right Choice for Every TeamI’m not saying Styled Components is better than Radium, Aphrodite, Glamor, Glamorous, Emotion, or any of the other CSS-in-JS libraries.
  • BEM, SMACSS, and other CSS patterns provide a lot of great guidelines for managing styles.
  • 🎉)From my experience, building a component library is the best way to keep UI consistent and predictable across applications, and CSS-in-JS has been the best tooling available to build these libs.Why We Chose Styled ComponentsWe ❤️ Styled ComponentsWe were drawn to CSS-in-JS for the reasons mentioned above, but Styled Components…
  • Along with the basic Sass support, there’s also Polished, a small toolset created by Styled Components to provide additional Sass functionality and other helpful tooling.Native Mobile SupportOur team is also in the process of developing a native mobile app with React Native.
  • Those conversations will help establish patterns for best-practices leading us to more consistent and predictable UI.Final ThoughtsStyled Components has been great for our team, and I think it could be really useful for a lot of other teams as well.

Unfortunately Twitter is not ideal for providing context and longer explanation, and I thought this might be a good way to follow up. Given that, a lot of this article describes what led to our…

Why We Use Styled Components at Decisivand why you might consider it as wellOverviewA couple days ago, I posted this somewhat-snarky tweet:It surprisingly led to some good discussion in this thread:Thread on why CSS-in-JS makes senseUnfortunately Twitter is not ideal for providing context and longer explanation, and I thought this might be a good way to follow up. Given that, a lot of this article describes what led to our decision to use CSS-in-JS, and provides specific reasons for choosing Styled Components further below. I hope what follows is useful for you and your team.DisclaimerThere are a lot of strong opinions surrounding CSS-in-JS, so I’d like to start with a few clarifications. If you’re already familiar with CSS-in-JS, you can probably skip this section.I Don’t Hate CSSI don’t want CSS to die. I’m not trying to avoid it. I don’t think it’s obsolete, outdated, or stagnant. And I certainly don’t want a JavaScript overhaul of CSS. That’s not what CSS-in-JS is about regardless of the hype.Styled Components Isn’t the Right Choice for Every TeamI’m not saying Styled Components is better than Radium, Aphrodite, Glamor, Glamorous, Emotion, or any of the other CSS-in-JS libraries. All of these libs have done incredible work and solved a lot of challenging problems.I’m also not saying CSS-in-JS is right for your team. Styled Components works really well for us, and I’d like to share why and how.A Little History | The Early Days of ReactEvolving Ideas and ImplementationsBen Alman has this great tweet I like to reference from the early…

Why We Use Styled Components – Hacker Noon