117: Mitchell Hamilton - Writing CSS-in-JS with Emotion

In this episode, Adam talks to Mitchell Hamilton about writing your styles directly in your JavaScript components using the CSS-in-JS library Emotion.

Show Notes

Topics include:

• What CSS-in-JS even is
• What Emotion does differently than other CSS-in-JS libraries
• How to actually use Emotion to style your projects
• How the JSX pragma works and what it's for
• How Emotion works under the hood
• Performance
• Adding global styles to your project
• Style re-use and composition in Emotion
• Using Emotion with server-side rendering

Sponsors:

• Cloudinary, sign up and get 300,000 images/videos, 10GB of storage and 20GB of monthly bandwidth for free
• DigitalOcean, get your free $50 credit at do.co/fullstack

Links:

• Emotion
• Glam
• Glamor
• Glamorous
• Styled Components
• JSX pragma
• CSSStyleSheet.insertRule()
• Global styles in Emotion
• Server-side rendering in Emotion

What is Full Stack Radio?

A podcast for developers interested in building great software products. Every episode, Adam Wathan is joined by a guest to talk about everything from product design and user experience to unit testing and system administration.