When you enroll in this course, you'll also be enrolled in this Specialization.
Learn new concepts from industry experts
Gain a foundational understanding of a subject or tool
Develop job-relevant skills with hands-on projects
Earn a shareable career certificate
There is 1 module in this course
If you are wondering how to enhance your CSS for styling React component systems, styled components are the way to go.
Styled components are helpful for many reasons. They reduce class name bugs, they make your components more readable, and they allow you to navigate your CSS more easily. They also allow for dynamic styling and automatic vendor prefixing.
This one-hour course follows a “lesson and project” approach. You’ll learn the core concepts and complete mini-challenges to test your understanding. Then you'll put your new skills to good use with a fun and practical project. By the end of the course, you'll have a cool progress tracker to add to your portfolio or even expand upon to show off your coding skills.
If you're wondering how to enhance your CSS for styling React component systems, look no further. Styled components reduce class name bugs, make your components more readable, and allow you to navigate your CSS more easily.
What's included
1 assignment19 plugins
Show info about module content
1 assignment•Total 10 minutes
React Styled Components Quiz•10 minutes
19 plugins•Total 102 minutes
Introduction to Styled Components•3 minutes
Welcome to interactive lessons!•1 minute
Why use them?•4 minutes
Setup and Syntax•8 minutes
Setting up from scratch - Project work•7 minutes
Styling through Props•12 minutes
Separating Components and passing props - Project work•8 minutes
Extending Styles•6 minutes
Extended Styles in real life examples - Project work•6 minutes
Polymorphic Prop•5 minutes
Passing props•4 minutes
Passing props in real life examples - Project work•7 minutes
If else statements in styling•9 minutes
If else statements in styled Components - Project work•5 minutes
Nesting•4 minutes
Animations•6 minutes
Rendering our Progress Tracker based on todays Date - Project•5 minutes
Update your own Progress - Project•1 minute
What's Next?•1 minute
Earn a career certificate
Add this credential to your LinkedIn profile, resume, or CV. Share it on social media and in your performance review.
Scrimba is an interactive code-learning platform with over a million users from all over the world. They feature highly interactive and engaging courses about programming and web development.
When will I have access to the lectures and assignments?
To access the course materials, assignments and to earn a Certificate, you will need to purchase the Certificate experience when you enroll in a course. You can try a Free Trial instead, or apply for Financial Aid. The course may offer 'Full Course, No Certificate' instead. This option lets you see all course materials, submit required assessments, and get a final grade. This also means that you will not be able to purchase a Certificate experience.
What will I get if I subscribe to this Specialization?
When you enroll in the course, you get access to all of the courses in the Specialization, and you earn a certificate when you complete the work. Your electronic Certificate will be added to your Accomplishments page - from there, you can print your Certificate or add it to your LinkedIn profile.
Is financial aid available?
Yes. In select learning programs, you can apply for financial aid or a scholarship if you can’t afford the enrollment fee. If fin aid or scholarship is available for your learning program selection, you’ll find a link to apply on the description page.