src Directory

Core Idea

Next.js supports placing app or pages inside a src/ folder to separate application code from root-level config files.

Key Concepts

• src/app or src/pages: alternative location for router folders; ignored entirely if app/pages also exist at the project root.
• Root-level exceptions: public/, package.json, next.config.js, tsconfig.json, and .env.* files must stay at the project root even when using src/.

Code Examples

None (structural convention, no code shown in source).

Reference Tables

None.

Anti-patterns

• Having both root app/pages and src/app/src/pages: the src version is silently ignored.
• Forgetting to update tailwind.config.js content: must add the /src prefix when moving to a src/ layout.
• Forgetting tsconfig.json paths: import aliases like @/* must be updated to point into src/.
• Placing Proxy outside src/: when using src, proxy.ts must also live inside src/.

Key Takeaways

1. Moving to src/ is purely organizational; move /components, /lib, and Proxy along with it.
2. Update Tailwind content paths and TypeScript paths aliases after migrating.
3. public/ and root config/env files never move into src/.

Connects To

• public: stays at project root regardless of src/ usage.
• Proxy: must be relocated into src/ if that layout is adopted.