Next JS Project structure and organization
farid46Author
Table of Contents
Overview
Folder and file conventions
Top-level folders
Top-level files
Routing Files
Nested routes
Dynamic routes
Route groups and private folders
Parallel and Intercepted Routes
Metadata file conventions
App icons
Open Graph and Twitter images
SEO
Organizing your project
Component hierarchy
Colocation
Private folders
Route groups
src folder
Examples
Store project files outside of app
Store project files in top-level folders inside of app
Split project files by feature or route
Organize routes without affecting the URL path
Opting specific segments into a layout
Opting for loading skeletons on a specific route
Creating multiple root layouts
In the example above, both (marketing) and (shop) have their own root layout.