menu

styled-components

Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress!

Channels
Chat
view-forward
# All channels
view-forward
# General
view-forward
# Help
view-forward
# jest
view-forward
# Off Topic
view-forward
# Website
view-forward
Team

BEM + SASS vs Styled Components

February 23, 2018 at 11:08am

BEM + SASS vs Styled Components

February 23, 2018 at 11:08am (Edited 3 years ago)
Do we have anyone switched from one another OR thinks either one is better suit his / her needs?
We'd love to hear your thoughts and reasons!

February 23, 2018 at 11:17am
It's a completely different paradigm. With SC you're building fully encapsulated components. With BEM and Sass you're still styling DOM elements after the fact, with only arguably better tooling around it.
like-fill
1
  • reply
  • like
Some say those scale better
  • reply
  • like
If scale is what you need, then perhaps that argument holds.
  • reply
  • like
Curious why?
  • reply
  • like
I was using BEM from its start (early 2009), and there are a lot of things it did which new tools allow us, but there were also things I've missed after moving to styles-components, so I've tried to fix them by myself: http://kizu.ru/bemto-components/ — maybe you'll find this interesting.
like-fill
1
  • reply
  • like
What I love about SC is the very direct and obvious relation between logic and styles. With any classname based solution there is always a layer of indirection between one and the other, which makes things harder to understand. Sure it may be better optimized, but I prefer clarity first.
like-fill
3
  • reply
  • like
In a team with mostly back-end developers, SC is a godsend.
like-fill
1
  • reply
  • like
Went from BEM + SCSS to styled-components, never want to go back. BEM is just a set of conventions, and those become largely unnecessary when using styled-components (or similar CSS-in-JS solutions)
like-fill
2
  • reply
  • like
But it's really up to you & how you prefer to work
like-fill
1
  • reply
  • like
I'm super glad I don't have to deal with toggling classes based on props anymore ;)
like-fill
3
  • reply
  • like
Show more messages