CSS-in-JS: FTW || WTF?

A presentation at CSS Day + UX Special in in Amsterdam, Netherlands by bruce lawson

Everyone's talking about CSS-in-JS. It's the Kim Kardashian of web development. And, as with Kimmie, opinions are polarised. To some, CSS in JS just makes sense: it's local to your component, it can't leak and, hey, I know how to write JavaScript and CSS is weird.

To others, CSS-in-JS is an abomination that makes them want to emulate Kimmie and "release a fragrance" in disdain. Why are scripters so afraid of the cascade? Why the hesitance about inheritance?

Let's look at what CSS seems to lack, what the CSS-in-JS libraries can teach us, so we don't do as Kim's buttocks did and "Break the Internet".

Resources

The following resources were mentioned during the presentation or are useful additional information.

  • Stylable

    Stylable documentation

  • Potato Bruce

    Potato Bruce site. Clone the repo and tweak to see how Stylable works - the main styles are in /src/components/app.st.css