•63 modules•Intermediate

Next JS Mastery Course

Next.js is the React framework for building fast, SEO-friendly websites and web apps. Start with file-based routing, layouts and Server Components, then fetch and cache data, change it with Server Actions and forms, add login and protected pages, write metadata for search engines, and finally test, build and deploy a complete online bookshop.

Your Progress

0%

Track your journey through the Next JS course. Complete topics to increase your progress.

Course Completion0 of 63 topics

0/19

Beginner Done

0/34

Intermediate Done

0/10

Advanced Done

0

Hours Completed

Beginner Level

Foundational concepts to get you started withNext JS

Easy

What is Next.js? React for Real Websites

Start Learning
Easy

Setting Up Your Computer for Next.js

Start Learning
Easy

Creating Your First Next.js App

Start Learning
Easy

Understanding the Project Files

Start Learning
Easy

The Dev Server, Fast Refresh and Error Overlay

Start Learning
Easy

How File-Based Routing Works

Start Learning
Easy

Pages and Layouts

Start Learning
Easy

Linking and Navigating Between Pages

Start Learning
Easy

Dynamic Routes and params

Start Learning
Easy

Reading Search Params from the URL

Start Learning
Easy

Server Components Explained

Start Learning
Easy

Client Components and the use client Directive

Start Learning
Easy

Global CSS and CSS Modules

Start Learning
Easy

Styling with Tailwind CSS

Start Learning
Easy

Optimizing Images with next/image

Start Learning
Easy

Loading Fonts with next/font

Start Learning
Easy

Fetching Data in Server Components

Start Learning
Easy

Page Titles, Descriptions and Metadata

Start Learning
Easy

Deploying to Vercel

Start Learning

Intermediate Level

Deep dive into core Next JS concepts and patterns

Intermediate

Route Groups and Private Folders

Start Learning
Intermediate

Not Found Pages and Redirects

Start Learning
Intermediate

Templates and the Root Layout in Depth

Start Learning
Intermediate

Mixing Server and Client Components

Start Learning
Intermediate

State, Context and Providers in Next.js

Start Learning
Intermediate

The public Folder and Third-Party Scripts

Start Learning
Intermediate

Loading UI, Suspense and Streaming

Start Learning
Intermediate

Handling Errors with error.js

Start Learning
Intermediate

Fetching Data on the Client

Start Learning
Intermediate

Building a Data Layer and Talking to a Database

Start Learning
Intermediate

Environment Variables

Start Learning
Intermediate

Static and Dynamic Rendering

Start Learning
Intermediate

Caching with Cache Components and use cache

Start Learning
Intermediate

Cache Lifetimes, Tags and Revalidation

Start Learning
Intermediate

Pre-rendering Dynamic Routes with generateStaticParams

Start Learning
Intermediate

Server Functions and Server Actions

Start Learning
Intermediate

Building Forms with Server Actions

Start Learning
Intermediate

Validating Forms and Showing Errors

Start Learning
Intermediate

Pending States and Optimistic Updates

Start Learning
Intermediate

Search Forms with the Form Component

Start Learning
Intermediate

Building APIs with Route Handlers

Start Learning
Intermediate

Reading Cookies and Headers

Start Learning
Intermediate

Running Code Before Requests with Proxy

Start Learning
Intermediate

Open Graph Images and Social Cards

Start Learning
Intermediate

Sitemaps, robots.txt and App Icons

Start Learning
Intermediate

Lazy Loading with next/dynamic

Start Learning
Intermediate

Writing Pages with MDX

Start Learning
Intermediate

Using TypeScript with Next.js

Start Learning
Intermediate

Reading Older Projects: The Pages Router

Start Learning
Intermediate

Debugging Next.js Apps

Start Learning
Intermediate

Unit Testing with Vitest

Start Learning
Intermediate

End-to-End Testing with Playwright

Start Learning
Intermediate

Building for Production

Start Learning
Intermediate

Static Exports for Any Web Host

Start Learning

Advanced Level

Master advanced Next JS patterns and modern features

Advance

Partial Prerendering: Static Shells with Dynamic Parts

Start Learning
Advance

Caching in Projects Without Cache Components

Start Learning
Advance

Adding Login with Sessions and Cookies

Start Learning
Advance

Protecting Pages, Actions and APIs

Start Learning
Advance

Keeping Secrets and Data Safe

Start Learning
Advance

Parallel Routes and Intercepting Routes

Start Learning
Advance

Building a Multi-Language Site

Start Learning
Advance

Self-Hosting with Node.js and Docker

Start Learning
Advance

Upgrading Next.js Safely

Start Learning
Advance

Final Project: The Book Nook Store

Start Learning