← Next.js learning pathNext.js · Module 2 of 10
App Router and file routing
Folders inside app/ become URLs.
📖 Key ideas
- app/page.tsx is the home page /.
- app/about/page.tsx becomes /about.
- layout.tsx wraps pages and keeps shared UI.
- Dynamic routes: app/blog/[slug]/page.tsx.
- Special files: loading.tsx, error.tsx, not-found.tsx.
💡 Real-life example: File routing is like folders in a cabinet: the folder name is the label people use to find it.
page.tsxMakes a route publicly accessible
layout.tsxShared UI wrapper
[slug]Dynamic route segment
not-found.tsxCustom 404 UI