Pages & Routes

Next.js has a built-in router that allows you to navigate between pages. This router is based on the file system:

• You can add a named folder called login which contains a page.js|tsx file, url: https://yourapp.com/login
• You can add a named folder called admin which contains a page.js|tsx file, url: https://yourapp.com/admin
• You can add wildcard routes by adding a folder with the name of the route, e.g. admin/[...slug] which contains a page.js|tsx file, url: https://yourapp.com/admin/some-slug
• You can add a [...slug]/page.js|tsx file in the root of the app directory, url: https://yourapp.com/name-of-the-slug

├── [...slug]
│   └── page.js
├── admin
│   ├── [...slug]
│   │   └── page.js
│   └── page.js
├── favicon.ico
├── fonts
│   ├── GeistMonoVF.woff
│   └── GeistVF.woff
├── globals.css
├── layout.js
├── login
│   └── page.js
├── page.js
└── page.module.css

'use-server'

Mind, all pages are defaulted to be rendered server-side on the nodejs/nextjs server (usually a docker container or a serverless function).