Learn
Practice
Newsletter
Resources
Animations
New
F
Toggle theme
0
F
0
Toggle menu
Next.js Roadmap
What is Next.js & Why Use It
Setting up a Next.js Project
App Router vs Pages Router
Foundations
React Refresher (Components, Hooks, Context)
Project Structure & Conventions
Pages & File-based Routing
Nested Routes
App Router (Layouts, Templates, Slots)
Routing
Dynamic Routes
Catch-all Routes
getStaticProps (SSG)
Client-side Fetching (useEffect, SWR)
Streaming & Suspense
Data Fetching
getServerSideProps (SSR)
Next.js Server Components
CSS Modules
Styled JSX
UI Libraries (Chakra UI, Material UI, shadcn/ui)
Styling
Global CSS
Tailwind CSS with Next.js
API Routes in Next.js
Edge Functions
File Uploads & Image Optimization
APIs & Backend Features
Middleware
Connecting to Databases (Prisma, Supabase, MongoDB)
NextAuth.js Basics
OAuth Providers (Google, GitHub, Twitter)
Protecting Routes & API Endpoints
Authentication & Security
JWT Authentication
Role-based Authentication
Image Optimization (next/image)
Incremental Static Regeneration (ISR)
SEO in Next.js (Metadata, OpenGraph)
Performance & Optimization
Code Splitting & Bundle Analysis
Caching Strategies
Vercel Deployment
CI/CD Integration (GitHub Actions)
Monitoring & Error Tracking (Sentry, LogRocket)
Deployment & DevOps
Custom Server Deployment (Node.js, Docker)
Environment Variables & Secrets
Personal Portfolio with Next.js
E-commerce Store with Cart & Checkout
Dashboard with Server Components
Projects
Blog with Markdown & SSG
Authentication System with NextAuth.js
SaaS App with Subscriptions
Next.js Core Concepts Q&A
API Routes & Middleware Scenarios
Performance Optimization Questions
Interview Preparation
SSR vs SSG vs ISR Questions
Authentication & Security Questions
Case Studies (Vercel, Notion, Hashnode on Next.js)
Next.js Roadmap
