Organizing Routes and Files in Next.js – Private Folders, Route Groups, and Project Structure

Private Folders in Next.js

You can create private folders by prefixing the folder name with an underscore (_). These folders and their subfolders are excluded from the routing system and treated as internal implementation details:

app/blog/_components/Post.tsx  
app/blog/_lib/data.ts

Although Next.js allows colocating files safely inside the app directory by default, private folders offer added benefits:

• Separating UI logic from routing logic
• Organizing internal files consistently across the project
• Improving file navigation in code editors
• Avoiding naming conflicts with future Next.js conventions

Route Groups

To organize routes without affecting the URL, wrap folder names in parentheses. These folders are ignored in the final URL path:

app/(marketing)/page.tsx → /  
app/(shop)/cart/page.tsx → /cart

Route groups are useful for:

• Organizing routes by section, intent, or team
• Creating multiple nested layouts at the same segment level
• Applying layouts to a subset of routes

Using the src Folder

Next.js supports placing your application code (including app) inside an optional src folder. This helps separate app logic from configuration files:

src/app/page.tsx  
src/components/Button.tsx

Project Structure Strategies

Here are a few common strategies for organizing your project:

• Store files outside app: Keep routing in app and shared logic in root-level folders
• Store files inside app: Place shared folders like components or lib inside app
• Split by feature or route: Keep global logic in root and colocate route-specific logic inside route segments

Examples of Grouping and Layouts

• Group routes without changing the URL: Use folders like (marketing) or (shop)
• Create multiple root layouts: Remove the top-level layout.tsx and add one inside each route group
• Apply a layout to specific routes only: Move related routes (e.g., account, cart) into a shared group
• Apply a loading skeleton to a specific route: Place loading.tsx inside a route group like (overview)

Conclusion

By using private folders, route groups, and flexible structure strategies, you can build well-organized, scalable, and maintainable Next.js applications. These patterns help separate routing, UI, and internal logic while improving developer experience and project clarity.