Introduction
In this lesson, we’ll look at using Styled Components in React.
Styled Components is an example of a CSS-in-JS library, where JavaScript is used to style components. Tagged template literals are used to apply styles in the library.
Similar to CSS Modules, Styled Components results in local rather than global styles, though the library does provide for global styles as well as theming. Both are covered in the video lesson.
To install the Styled Components package run:
npm install styled-components
Video Lesson
Lesson Task
Brief
In this task you will practise styling a React app using Styled Components.
Download the XD file from this repo.
Process
Use Create React App and Styled Components to create a React app for the design.
Example answer
You can find an example solution in the answer branch of the repo.