Next.jsIntermediate
Next.js
Build full-stack web apps with Next.js and the App Router: file-based routing, Server and Client Components, data fetching, rendering (SSR/SSG/ISR), Route Handlers, Server Actions and deploy. The step after React.
12 chapters36 lessons48 challenges
Course curriculum
Chapter 1: Introduction to Next.js
- ▸What Next.js is
- ▸App Router vs Pages Router
- ▸Project structure
Chapter 2: Routing with the App Router
- ▸Nested routes and layouts
- ▸Dynamic routes: [slug]
- ▸Route groups and special files
Chapter 3: Server and Client Components
- ▸Server Components by default
- ▸"use client": Client Components
- ▸Composing server and client
Chapter 4: Data fetching
- ▸Fetching in Server Components
- ▸Caching and revalidation
- ▸Loading, streaming and Suspense
Chapter 5: Rendering: static, dynamic, ISR
- ▸Static vs dynamic
- ▸generateStaticParams
- ▸ISR: incremental regeneration
Chapter 6: Route Handlers (API)
- ▸route.ts: an API endpoint
- ▸Reading request and params
- ▸Route Handler or Server Action?
Chapter 7: Server Actions and mutations
- ▸"use server": server actions
- ▸Mutating data and updating the UI
- ▸Pending state and safety
Chapter 8: Navigation
- ▸The Link component
- ▸Programmatic navigation
- ▸redirect and notFound
Chapter 9: Metadata and errors
- ▸Metadata and SEO
- ▸Handling errors: error.tsx
- ▸not-found and template
Chapter 10: Styling and optimized assets
- ▸Styling: CSS Modules and Tailwind
- ▸Images with next/image
- ▸Fonts with next/font
Chapter 11: Middleware and authentication
- ▸The middleware
- ▸Cookies and session
- ▸Defense in depth
Chapter 12: Environment and deploy
- ▸Environment variables
- ▸Build and deploy
- ▸The full picture
Ready to level up?
Create a free account and start now: earn XP on every challenge and climb the leaderboard.