A Practical Folder Structure Guide for Large Next.js App Router Projects

A developer has shared a folder architecture guide for large Next.js projects using the App Router, based on lessons learned from reorganising a client dashboard. The structure separates routes into the app/ directory, domain-specific business logic into a features/ folder, and reusable UI primitives into components/ui. A key principle called the '10-second findability rule' requires that any piece of code — such as a password reset email handler — can be located within ten seconds, or the structure is considered flawed. Common early mistakes highlighted include dumping 80-plus components into a single folder, growing utility files to over a thousand lines, and scattering Server Actions across random page files instead of colocating them in a dedicated actions.ts. The guide also recommends route groups for separating marketing and dashboard shells, TypeScript strict mode, and an ESLint-enforced import direction policy for teams larger than three developers.