Next.js Discord

Discord Forum

NextJS project architecture.

Unanswered
Hilsa shad posted this in #help-forum
Open in Discord
Hilsa shadOP
Hi I have a question about NextJS, I've been using pure react and VITE builder until recently, but recently decided to try nextjs and ran into a few questions about the architecture\ hierarchy of the project.

Do I understand correctly that the “app” folder is the main folder (like src) and that's where we store our components, pages, styles and so on?

2 Replies

Roseate Spoonbill
When creating new next app, by default you have two options: have app folder directly in repo root, or to have app folder in src. The distinction is important though: app is not like src folder.

app folder has special meaning in Next - file and folder structure inside influences how pages are created. Everything outside does not take part in routing, so you can use place folders like components and lib in src safely. You can have components and lib folders inside app if you use _ (underscore) prefix for them.

For more structure tips, take a look at the folder structure propositions in next docs. They actually describe the options i mentioned in quite a detail: https://nextjs.org/docs/app/getting-started/project-structure