The styled-components Babel macro now has full support for the brand new css prop. Go from zero to React app with css prop in fifteen seconds! 🎉

From zero to css prop in fifteen seconds 🏎💨

There’s only three simple steps to kickstart your new React app with css prop support:

  1. Create your React app: create-react-app myapp (if you already have an existing cra-based app, skip this step)
  2. Install styled-components: npm…


A new, convenient way to quickly style and iterate on your components and their boundaries has landed in styled-components 💅

const MyButton = () => (
<button
css={`
color: papayawhip;
background: palevioletred;
`}
>
Click me!
</button>
)


Max Stoiber is the CTO at Spectrum, a real-time chat platform for online communities. In this guest post he describes how they secured their GraphQL API from attackers.


styled-components/primitives

Announcing styled-components/primitives, an experimental entry point combining styled-components and react-primitives


TL;DR

  • Half the bundle size, (22kB → 12kB) thus much faster to load for your users
  • Best-in-class server-side rendering with critical CSS, style rehydration and concurrency support out of the box
  • We’ve added the.attrs helper to support passing attributes to any styled-component, making it much easier to integrate existing CSS codebases.
  • We’ve added an .extend and a .withComponent helper to make it easier to create multiple components that share some or all of their CSS.
  • You can now reference…


Photo by David Goehring

Nobody knows what the fuck they’re doing.

That’s just the nature of front-end…


What does the scripts property do?

Chances are high you’re using scripts if you’re using npm: Whenever you enter $ npm run <command> (which is a short version of $ npm run-script <command>) into the terminal, that’s a script being ran.

Max Stoiber

Technical cofounder of Spectrum.chat, creator of react-boilerplate, co-creator of 💅 styled-components and maintainer of KeystoneJS and micro-analytics.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store