From the course: Master Next.js by Building Scalable Apps with Routing, Databases, and Performance

Unlock this course with a free trial

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

Defining routes

Defining routes

So, now it's time to create more routes in the Next.js application. As I discussed in the previous section, from Next.js 13 and onwards, we have the app router as well. And that is the newer approach to deal with the Next.js applications. So we are beginning with the app routes. We have also discussed that the page.js file delivers the root that is home route content. So when we type localhost colon 3000, it loads the page.js file residing in the app folder. Now let's say when you type localhost colon 3000 slash products, then it should open the product page. So here the name products is the route we want to create. And to do so, I will create a folder named products in the app folder. Now the next step is we must create a file named page.js. So let's do that. Now we have to create a React component only. Here in the page.js, I'll say export default function and let's say products. Remember that the component name does not have to be the same as the route name. It could have been…

Contents