Next.js Discord

Discord Forum

File Structure

Unanswered
American black bear posted this in #help-forum
Open in Discord
American black bearOP
i have a nextjs project it has 3 main but separate pages (there is no overlap between them )
i currently have it like this
App

Components
- A components
- B components
- C components

Lib
- A lib
- B lib
- C lib

A
- page
B
- page
C
- page

i hate this approach and would prefer

A
- page
- A Lib
-A components

etc but is this viable ?

7 Replies

Saint Hubert Jura Hound
its very hard to understand what kind of file structure u mean for both examples.
but i personally just put my components on the page theyre used on, unless theyre shared between multiple pages, then i put them in a shared components directory in which u can have separate sbudirectories for routes in case u have a lot of components
dont see why youd need separate lib folders
@Saint Hubert Jura Hound its very hard to understand what kind of file structure u mean for both examples. but i personally just put my components on the page theyre used on, unless theyre shared between multiple pages, then i put them in a shared components directory in which u can have separate sbudirectories for routes in case u have a lot of components
American black bearOP
yeah ill follow that approach i was concerned if i did

dashboard
- components
- A
page.tsx
layout.tsx


if a user goes to /dashboard/components/A the component would show but if it doesnt have a page it wont thankfully
Saint Hubert Jura Hound
oh yea no it wont. only these file/folder names have an effect on ur app:
https://nextjs.org/docs/app/api-reference/file-conventions
American black bearOP
thanks for the help
Cuvier’s Dwarf Caiman
Sure,I think it is totally viable to structure your Next.js project this way! In fact, it aligns with how modular and domain-driven design is often approached. By isolating each page’s components and libraries within its own folder, you’re keeping everything that’s relevant to each page inside that page’s directory, making your project more maintainable and scalable.