Next.js Discord

Discord Forum

Best place to locate screen components

Answered
AM posted this in #help-forum
Open in Discord
AMOP
Where is the best place to store components that are not re-used by other screens - not quite fitting in /components folder

But also you want to extract them from the main component for the screen

Example:

We do have User Stats screen that holds some activity about the user like

- Achievements
- Active days
- Rankings

All of these 3 components are made from atom components that are re-used, but these components itself are not good candidates for the /components because they are not shared across other screens, so what is your suggestion guys and how do you handle such situations
Answered by Clown
Please mark it as the answer.

I would also recommend reading this btw:
https://nextjs.org/docs/app/building-your-application/routing/colocation
View full answer

6 Replies

Clown
Just put them in the same folder as the page.
Nextjs doesnt care as long they aren't named "route" or "page"
AMOP
so you mean i can have 

/app
   (user)
      /user-profile
          page.tsx
      /user-stats
          page.tsx
          Achivements.tsx
          ActiveDays.tsx
          Rankings.tsx


ot smth similar?
Clown
Yep
@Clown Yep
AMOP
tyvm!!!
@AM tyvm!!!
Clown
Please mark it as the answer.

I would also recommend reading this btw:
https://nextjs.org/docs/app/building-your-application/routing/colocation
Answer