Style a React component with styled-components

Share this video with your friends

Send Tweet

In this lesson, we remove the mapping between a React component and the styles applied to it via classnames. We write our styles directly within the component, in a real CSS syntax, with the full power of JavaScript.

Free Community Resource

A Community Resource means that it’s free to access for all. The instructor of this lesson requested it to be open to the public.

Brendan Whiting
Brendan Whiting
~ 2 years ago

How does the template string end being taken as an argument to the styled.div here? This is some new JavaScript syntax that I haven't seen before, and I don't understand how we get to use it just by importing the package.

const Name = styled.h2`
margin-top: 0;
font-weight: 900;
marginBottom: .75rem;
`;