Best project structure for Next.js

[elijah-alonzo]

Next.js Best Project Structure

How should I set my next.js project? This is my current setup.

root/
├── app/
│   ├── section                 # Sections seen in page
│   │   ├── page.tsx          # Scaffold per sections
│   │   ├── style.css          # Stylings that applies only to that page
│   │   └── data.json        # Data that is displayed in the pages 
│   ├── layout.tsx             # Global layout. 
│   ├── global.css             # Global styling. 
│   └── page.tsx               # Root page that calls on the sections
│
├── .gitignore
├── package.json
└── README.md

[tinatuazon]

It'd be better to just leave routes on app and move all sections into reusable components to make it more scalable.