Learn how to create flexible components in React for your design system using Styled Components–a CSS in JS library.

Styled Components help make components more readable and keep the headache of styling and element architecture separated.

The pros and cons are often debated, but we’re big fans at Skillthrive. If you want to learn more about the pros and cons so you can make the decision for yourself, check out this article: https://webdesign.tutsplus.com/articles/an-introduction-to-css-in-js-examples-pros-and-cons--cms-33574

👀 LIVE DEMO 👀

https://zealous-morse-4e0f08.netlify.com/

🗂 DOWNLOADS 🗂

https://gum.co/wHdBq

⏰ TIMESTAMPS ⏰

Setup a Gatsby Site with Styled Components: 1:37

Create the Styled Components: 4:51

Install Google Fonts on Gatsby: 7:28

How to Use a JavaScript Switch Statement with Styled Components: 7:57

How to Use Your New Styled Component: 14:22

#WebDev #WebDesign #WebDevelopment

#javascript #webdev #react #javascript switch statements #styled components

Level Up Your React Designs with Styled Components + JavaScript Switch Statements
1.30 GEEK