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.

Highlight Article JSX structure

Highlight Article JSX structure - Next.js Tutorial

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

Start my 1-month free trial Buy for my team

Highlight Article JSX structure

“

So, the first thing we're going to be doing here is take care of the highlight article. That's what I'm basically calling this thing here that is going to be displayed at the top of the blog, which is pretty much like the hero section, it should engage the reader to read whatever article is behind this. So, what we need for that is, first of all, again, two columns. The first column is going to be a text box with the headline, some intro from the article, And then a button that if you click on it, it will bring you to that article. And then on the right hand side, we just have the featured image. So if we go into the code, right here, the first thing we're going to create is exactly that component. And since we're going to create quite a few components for the blog page, we are just going to make a new folder for that. in blog we're going to say highlight article.jsx and in here I'm just going to create the empty component. Now one thing that we also have to do is obviously create the…

Contents