Course outline for Next.js

Next.js Application Structure

• React framework responsibilities
• App Router and Pages Router differences
• Project setup and development workflow
• Build and runtime configuration

Routing and Layouts

• File-based routes and nested layouts
• Dynamic routes and navigation
• Route groups and shared interfaces
• Not-found and error boundaries

Server and Client Components

• Rendering boundaries and client interactivity
• Props and serializable data
• Hydration and browser-only APIs
• Keeping secrets and privileged work on the server

Data Fetching and Caching

• Server-side reads and loading states
• Streaming and suspense boundaries
• Version-specific cache and revalidation behavior
• Testing freshness rather than assuming defaults

Forms and Server Operations

• Route handlers and Server Actions
• Input validation and response contracts
• Authentication versus authorization
• Duplicate requests and error handling

Content and User Experience

• Metadata and search discoverability
• Images, fonts, and static assets
• Accessible navigation and form states
• Performance inspection and bundle boundaries

Testing and Deployment

• Component and integration tests
• Environment variables and build outputs
• Static export versus server runtime needs
• Deployment checks, monitoring, and recovery

Practical Exercise

• Build a routed catalog with a protected edit workflow
• Validate mutations and reject unauthorized requests
• Test loading, failed reads, and cache refresh behavior
• Package the application and document its runtime requirements