App Router
ELI5 — The Vibe Check
App Router is Next.js's new routing system that uses the app/ directory and embraces React Server Components. Layouts, loading states, and error handling are all file-based. It's the new way to do Next.js, and if you learned Pages Router first, prepare to re-learn everything.
Real Talk
App Router is Next.js's routing paradigm (v13+) built on React Server Components, using a file-system based convention in the app/ directory. It supports nested layouts, parallel routes, intercepting routes, streaming, and server-first component rendering by default.
When You'll Hear This
"App Router makes layouts and loading states so much cleaner" / "The migration from Pages Router to App Router took us two weeks"
Related Terms
File-Based Routing
File-Based Routing means your folder structure IS your routing. Create pages/about.vue and you get /about.
Pages Router
Pages Router is the OG Next.js routing system where you put files in the pages/ directory and they become routes. Simple, proven, and still works fine.
React Server Components
React Server Components run on the server and send zero JavaScript to the browser.