Next.js overview + learning flow
Use this page as the starting point for Next.js. It’s intentionally link-heavy and brief.
Recommended learning flow (official)
- Do the official interactive course:
- Then use the docs as your reference (App Router):
Optional code-along (team pick)
- OrcDev: “Fullstack Modern Admin Panel Tutorial in Next.js” (Shadcn UI, Drizzle, Neon, tRPC): https://www.youtube.com/watch?v=W-Bd7nzzz3o
What Next.js is (in our stack)
- A React framework for routing, server rendering, and “server + client” code living in one app.
- We standardize on App Router (not Pages Router).
Mental model (high level)
Key sections to learn (with links)
- App Router fundamentals: https://nextjs.org/docs/app
- Routing (segments, layouts, pages): https://nextjs.org/docs/app/building-your-application/routing
- Data fetching & caching: https://nextjs.org/docs/app/building-your-application/data-fetching
- Rendering (Server/Client Components, streaming): https://nextjs.org/docs/app/building-your-application/rendering
- Error handling (loading/error/not-found): https://nextjs.org/docs/app/building-your-application/routing/loading-ui-and-streaming
- Route handlers (server endpoints): https://nextjs.org/docs/app/building-your-application/routing/route-handlers
- Deployment/production basics: https://nextjs.org/docs/app/building-your-application/deploying
Our non-negotiables (short)
- Default to Server Components; opt into Client Components only when needed.
- Calls to internal microservices happen server-side only (typically behind tRPC procedures).
- Validate external input at the boundary (Zod).
Next pages in this repo
content/docs/08-nextjs-app-router-boundaries.mdx
Last updated on