Adam Wathan

Technika

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

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.

Topics include:<ul>
<li>What CSS-in-JS even is</li>
<li>What Emotion does differently than other CSS-in-JS libraries</li>
<li>How to actually use Emotion to style your projects</li>
<li>How the JSX pragma works and what it's for</li>
<li>How Emotion works under the hood</li>
<li>Performance</li>
<li>Adding global styles to your project</li>
<li>Style re-use and composition in Emotion</li>
<li>Using Emotion with server-side rendering</li>
</ul>Sponsors:<ul>
<li>
<a href="https://cloudinary.com/users/register/free?utm_source=fullstackradio&utm_medium=Sponsored_Podcast&utm_content=fullstackradio_PodCast">Cloudinary</a>, sign up and get 300,000 images/videos, 10GB of storage and 20GB of monthly bandwidth for free</li>
<li>
<a href="https://www.digitalocean.com/?refcode=74a1c5d63dac&utm_source=fullstackradio&utm_medium=podcast&utm_campaign=DO_Dev_Signup_Cold_FullStackRadio_Podcast">DigitalOcean</a>, get your free $50 credit at <a href="https://do.co/fullstack">do.co/fullstack</a>
</li>
</ul>Links:<ul>
<li><a href="https://emotion.sh">Emotion</a></li>
<li><a href="https://github.com/threepointone/glam">Glam</a></li>
<li><a href="https://github.com/threepointone/glamor">Glamor</a></li>
<li><a href="https://github.com/paypal/glamorous">Glamorous</a></li>
<li><a href="https://www.styled-components.com/">Styled Components</a></li>
<li><a href="https://babeljs.io/docs/en/babel-plugin-transform-react-jsx#options">JSX pragma</a></li>
<li><a href="https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet/insertRule">CSSStyleSheet.insertRule()</a></li>
<li><a href="https://emotion.sh/docs/globals">Global styles in Emotion</a></li>
<li><a href="https://emotion.sh/docs/ssr">Server-side rendering in Emotion</a></li>
</ul>

Topics include:<ul><li>What CSS-in-JS even is</li><li>What Emotion does differently than other CSS-in-JS libraries</li><li>How to actually use Emotion to style your projects</li><li>How the JSX pragma works and what it's for</li><li>How Emotion works under the hood</li><li>Performance</li><li>Adding global styles to your project</li><li>Style re-use and composition in Emotion</li><li>Using Emotion with server-side rendering</li></ul>Sponsors:<ul><li><a href="https://cloudinary.com/users/register/free?utm_source=fullstackradio&utm_medium=Sponsored_Podcast&utm_content=fullstackradio_PodCast">Cloudinary</a>, sign up and get 300,000 images/videos, 10GB of storage and 20GB of monthly bandwidth for free</li><li><a href="https://www.digitalocean.com/?refcode=74a1c5d63dac&utm_source=fullstackradio&utm_medium=podcast&utm_campaign=DO_Dev_Signup_Cold_FullStackRadio_Podcast">DigitalOcean</a>, get your free $50 credit at <a href="https://do.co/fullstack">do.co/fullstack</a></li></ul>Links:<ul><li><a href="https://emotion.sh">Emotion</a></li><li><a href="https://github.com/threepointone/glam">Glam</a></li><li><a href="https://github.com/threepointone/glamor">Glamor</a></li><li><a href="https://github.com/paypal/glamorous">Glamorous</a></li><li><a href="https://www.styled-components.com/">Styled Components</a></li><li><a href="https://babeljs.io/docs/en/babel-plugin-transform-react-jsx#options">JSX pragma</a></li><li><a href="https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet/insertRule">CSSStyleSheet.insertRule()</a></li><li><a href="https://emotion.sh/docs/globals">Global styles in Emotion</a></li><li><a href="https://emotion.sh/docs/ssr">Server-side rendering in Emotion</a></li></ul>

Aplikace Youradio Talk

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

Poslechněte si podcast