Nov 1, 2021
A Folder Structure That Keeps a Next.js App Sane (App Router)
nextjsarchitecturefolder-structureapp-router
A practical, App Router-first folder structure for real-world Next.js apps, with a routing layer, feature layer, and shared layer that scales from small sites to multi-feature dashboards.
1Organize code into routing, feature, and shared layers instead of one giant components folder
2Keep app/ thin and let features/ own real domain logic
3Use components/ only for truly shared UI primitives, not feature-specific views
4Group domain logic, UI, hooks, and types per feature under features/
5Start simple for small projects and introduce features/ when components/ becomes a junk drawer