Next.js Tutorial

Start Here

1 Next.js Complete Beginner's Guide 28 min

Module 1: Next.js Foundations

2 Introduction to Next.js — Complete Guide 8 min 3 Installing Next.js — Complete Guide 8 min 4 Understanding Project Structure — Complete Guide 8 min 5 App Router Basics — Complete Guide 8 min 6 Pages and Layouts — Complete Guide 8 min 7 React Components in Next.js — Complete Guide 8 min 8 Client Components — Complete Guide 8 min 9 Server Components — Complete Guide 8 min 10 Routing Fundamentals — Complete Guide 8 min 11 Dynamic Routing — Complete Guide 8 min

Module 2: Layouts & Styling

12 Nested Layouts — Complete Guide 8 min 13 Navigation and Linking — Complete Guide 8 min 14 Static Assets — Complete Guide 8 min 15 CSS Modules — Complete Guide 8 min 16 Tailwind CSS in Next.js — Complete Guide 8 min 17 Data Fetching — Complete Guide 8 min 18 Server Actions — Complete Guide 8 min 19 Forms in Next.js — Complete Guide 8 min 20 Form Validation — Complete Guide 8 min 21 Authentication Basics — Complete Guide 8 min

Module 3: Data & Forms

22 Middleware — Complete Guide 8 min 23 API Route Handlers — Complete Guide 8 min 24 Database Integration — Complete Guide 8 min 25 File Upload — Complete Guide 8 min 26 Image Optimization — Complete Guide 8 min 27 Metadata and SEO — Complete Guide 8 min 28 Performance Optimization — Complete Guide 8 min 29 Deployment — Complete Guide 8 min 30 E-Commerce App Project — Complete Guide 8 min 31 SaaS Dashboard Project — Complete Guide 8 min

Module 4: Auth & APIs

32 SSR vs SSG vs ISR — Complete Guide 8 min 33 Streaming and Suspense — Complete Guide 8 min 34 Loading and Error UI — Complete Guide 8 min 35 Route Groups — Complete Guide 8 min 36 Parallel Routes — Complete Guide 8 min 37 Intercepting Routes — Complete Guide 8 min 38 Edge Runtime — Complete Guide 8 min 39 Caching in Next.js — Complete Guide 8 min 40 Revalidating Data — Complete Guide 8 min 41 TanStack Query in Next.js — Complete Guide 8 min

Module 5: SEO & Deploy

42 NextAuth.js — Complete Guide 8 min 43 Clerk Authentication — Complete Guide 8 min 44 OAuth and Social Login — Complete Guide 8 min 45 Protected Routes — Complete Guide 8 min 46 Prisma ORM — Complete Guide 8 min 47 MongoDB with Next.js — Complete Guide 8 min 48 PostgreSQL with Next.js — Complete Guide 8 min 49 Environment Variables — Complete Guide 8 min 50 Unit Testing — Complete Guide 8 min 51 Integration Testing — Complete Guide 8 min

Module 6: Advanced Routing

52 Playwright E2E — Complete Guide 8 min 53 CI/CD for Next.js — Complete Guide 8 min 54 Internationalization — Complete Guide 8 min 55 Accessibility — Complete Guide 8 min 56 XSS and CSRF Protection — Complete Guide 8 min 57 Security Headers — Complete Guide 8 min 58 Rate Limiting — Complete Guide 8 min 59 Structured Data — Complete Guide 8 min 60 Sitemap and Robots — Complete Guide 8 min 61 Zustand State — Complete Guide 8 min

Module 7: Auth & Database

62 Redux Toolkit in Next.js — Complete Guide 8 min 63 React Context Patterns — Complete Guide 8 min 64 Monorepo with Turborepo — Complete Guide 8 min 65 Docker for Next.js — Complete Guide 8 min 66 Vercel Deployment — Complete Guide 8 min 67 AWS Amplify — Complete Guide 8 min 68 Azure Static Web Apps — Complete Guide 8 min 69 Micro Frontends — Complete Guide 8 min 70 Remix vs Next.js — Complete Guide 8 min 71 Web Vitals Tuning — Complete Guide 8 min

Module 8: Quality & Security

72 Font Optimization — Complete Guide 8 min 73 Bundle Analysis — Complete Guide 8 min 74 Blog Application Project — Complete Guide 8 min 75 Student Portal Project — Complete Guide 8 min 76 Job Portal Project — Complete Guide 8 min 77 Hospital Portal Project — Complete Guide 8 min 78 Food Delivery Frontend Project — Complete Guide 8 min 79 Banking Dashboard Project — Complete Guide 8 min 80 LMS Course Player Project — Complete Guide 8 min 81 CRM Admin Project — Complete Guide 8 min

Module 9: Cloud & Scale

82 Real-Time Chat Project — LearnHub Project 8 min 83 Multi-Tenant SaaS Project — LearnHub Project 8 min 84 Inventory Dashboard Project — LearnHub Project 8 min 85 Travel Booking Project — LearnHub Project 8 min 86 News Portal Project — LearnHub Project 8 min 87 Portfolio Site Project — LearnHub Project 8 min 88 Enterprise Architecture — LearnHub Project 8 min 89 Clean Folder Structure — LearnHub Project 8 min 90 API Design Patterns — LearnHub Project 8 min 91 Error Handling Patterns — LearnHub Project 8 min

Module 10: Portfolio Projects

92 Logging and Monitoring — LearnHub Project 8 min 93 Stripe Payments — LearnHub Project 8 min 94 Analytics and Observability — LearnHub Project 8 min 95 Storybook with Next.js — LearnHub Project 8 min 96 GraphQL with Next.js — LearnHub Project 8 min 97 Content Security Policy — LearnHub Project 8 min 98 Partial Prerendering — LearnHub Project 8 min 99 Server Actions Security — LearnHub Project 8 min 100 Production Checklist — LearnHub Project 8 min 101 Next.js Career Roadmap — LearnHub Project 8 min