From the course: Build Modern Web Apps with React, Hooks, State Management, and APIs Using Vite or Next.js

Unlock this course with a free trial

Join today to access over 25,200 courses taught by industry experts.

Styled Components: Part 2

Styled Components: Part 2

From the course: Build Modern Web Apps with React, Hooks, State Management, and APIs Using Vite or Next.js

Start my 1-month free trial Buy for my team

Styled Components: Part 2

“

Welcome back. In the previous video, we defined a card style components, which has all the CSS properties defined inside here. So another benefit of using CSS in JS libraries is that usually some of the developers prefer to have CSS and the business logic for a component in one single file. Using these libraries, We can use this kind of logic inside one single file. Using styled components or CSS and JS libraries, we can achieve this target very well. We can have one single file being defined and this one single file can have everything defined in one place. Now without a further ado, let's style our component further. I'm going to define a name component here. Let it be called as H2. Define the template retro, close it down and let's style it. Let's give it a color, let's say of 2e7d32. give it a margin bottom of about 10 pixel and I think that will be it. Let's show this name over here. I'm going to call it name and inside this we can have our name from the props. Next we are going…

Contents