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.

Rendering customers and buyers report

Rendering customers and buyers report - Next.js Tutorial

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

Start my 1-month free trial Buy for my team

Rendering customers and buyers report

“

In this lecture, we will create the dashboard component and display the customers and the buyers count in the respective cards. So let me create the dashboard folder in the screens folder, along with the index.jsx file. Now let me quickly create the dashboard component, which will display the text dashboard in the div and will also export it. Now I will open the page.js file, removing all the existing code and will render the dashboard component. Let's save and check the output. I'll open the admin dashboard and the component is rendered. Now we will create cards which will display the count of customers and the buyers. So I will open the dashboard component and I will create a div with styles. So here I'll say class name grid, grid calls 3 and gap of 5. Then I will create a card by saying div class name dashboard card. Then I will add the card title. So we'll say h1 class name, text Excel, font bold, the text will be total buyers. Then another h1 where I'm going to say class name…

Contents