From the course: The Freelance Stack: Real Project with Next.js and Strapi

Unlock this course with a free trial

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

Hero section JSX structure

Hero section JSX structure

So, if we look into our design, we can see we've done the footer, we've done the header, right here, but now what we want to do is we want to do the main page of our application, which is basically all of, oops, all of this, let's remove that, all of this. That's the next part. And we're going to start with the hero section right here. what we want to look out for is whenever we code up a component we want to see whether it's a repeated component somewhere else in the design and with this hero section we see that it's actually not just on the main page it's also over here on the experience page it also happens to be here on the blog page and we'll see how we handle it then but for now we want to write this hero section in a way that we can just pull it in or just use it on our main page but also then on the experience page so it should be its own component that can be adjusted depending on the color theme right so here we have like this bluish color here it's going to be orange and we…

Contents