Loading roadmap structure…

~/roadmap

Learning progress and continuous skill telemetry tracked via roadmap.sh

Next.js

Learn everything you need to master Next.js

Syncing progress...

$ notice :: mobile_viewport_detected

Interactive 2D graph view is optimized for desktop & tablet viewports. Showing simplified topic outline below.

Topic Outline Summary

94 topics

JavaScript BasicsPending

Why ReactPending

Why Frontend FrameworksPending

SPA vs SSRPending

IntroductionPending

Next.jsPending

Why Next.jsPending

RemixPending

Rendering StrategiesPending

create-next-appPending

Loading and StreamingPending

Types of routersPending

Error StatesPending

Why use App Router?Pending

Routing PatternsPending

Routing TerminologyPending

API EndpointsPending

Rendering PagesPending

Structuring RoutesPending

Layouts and TemplatesPending

Next.js Routing BasicsPending

ClientPending

ServerPending

Memoization in FetchPending

Revalidating Cached DataPending

React CachePending

Revalidation ErrorsPending

Caching DataPending

Parallel vs SequentialPending

Preloading DataPending

Data Fetching PatternsPending

Handling Sensitive DataPending

Server ActionsPending

Client RenderedPending

Server RenderedPending

CompositionPending

Global CSSPending

CSS ModulesPending

SassPending

Tailwind CSSPending

CSS in JSPending

ImagesPending

VideosPending

FontsPending

MetadataPending

ScriptsPending

Package BundlingPending

Lazy LoadingPending

AnalyticsPending

InstrumentationPending

OpenTelemetryPending

Static AssetsPending

Third Party LibrariesPending

Memory UsagePending

TypeScriptPending

PrettierPending

ESLintPending

Setting things UpPending

Environment VariablesPending

Markdown and MDXPending

Custom ServerPending

VitestPending

JestPending

PlaywrightPending

CypressPending

Preparing for ProductionPending

Deployment OptionsPending

React FrameworksPending

SSRPending

SPAPending

CSRPending

SSGPending

PagesPending

AppPending

Intercepting RoutesPending

Parallel RoutesPending

Static vs DynamicPending

StreamingPending

ReditectsPending

CachingPending

MiddlewarePending

Setting HeadersPending

Using CookiesPending

Use casesPending

Route MatcherPending

Fetching LocationsPending

Runtimes and TypesPending

Node.jsPending

EdgePending

InternationalizationPending

Node.js ServerPending

Docker ContainerPending

Static ExportPending

AdaptersPending

JavaScript Basics

Why React

Why Frontend Frameworks

SPA vs SSR

Introduction

Next.js

Why Next.js

Remix

Rendering Strategies

create-next-app

Loading and Streaming

Types of routers

Error States

Why use App Router?

Routing Patterns

Routing Terminology

API Endpoints

Rendering Pages

Structuring Routes

Layouts and Templates

Next.js Routing Basics

Client

Server

Memoization in Fetch

Revalidating Cached Data

React Cache

Revalidation Errors

Caching Data

Parallel vs Sequential

Preloading Data

Data Fetching Patterns

Handling Sensitive Data

Server Actions

Client Rendered

Server Rendered

Composition

Global CSS

CSS Modules

Sass

Tailwind CSS

CSS in JS

Images

Videos

Fonts

Metadata

Scripts

Package Bundling

Lazy Loading

Analytics

Instrumentation

OpenTelemetry

Static Assets

Third Party Libraries

Memory Usage

TypeScript

Prettier

ESLint

Setting things Up

Environment Variables

Markdown and MDX

Custom Server

Vitest

Jest

Playwright

Cypress

Preparing for Production

Deployment Options

Related Roadmaps

React Frameworks

SSR

SPA

CSR

SSG

Pages

App

Intercepting Routes

Parallel Routes

Static vs Dynamic

Streaming

Reditects

Caching

Middleware

Setting Headers

Using Cookies

Use cases

Route Matcher

Fetching Locations

Runtimes and Types

Node.js

Edge

Internationalization

Node.js Server

Docker Container

Static Export

Adapters

Scroll inside the canvas container above to browse the full roadmap.

Done

Learning

Skipped

Not Started

Loading roadmap structure…

Next.js Roadmap | Portfolio | Dimas Saputra

Next.js

Learn everything you need to master Next.js

Syncing progress...

$ notice :: mobile_viewport_detected

Interactive 2D graph view is optimized for desktop & tablet viewports. Showing simplified topic outline below.

Topic Outline Summary

94 topics

JavaScript BasicsPending

Why ReactPending

Why Frontend FrameworksPending

SPA vs SSRPending

IntroductionPending

Next.jsPending

Why Next.jsPending

RemixPending

Rendering StrategiesPending

create-next-appPending

Loading and StreamingPending

Types of routersPending

Error StatesPending

Why use App Router?Pending

Routing PatternsPending

Routing TerminologyPending

API EndpointsPending

Rendering PagesPending

Structuring RoutesPending

Layouts and TemplatesPending

Next.js Routing BasicsPending

ClientPending

ServerPending

Memoization in FetchPending

Revalidating Cached DataPending

React CachePending

Revalidation ErrorsPending

Caching DataPending

Parallel vs SequentialPending

Preloading DataPending

Data Fetching PatternsPending

Handling Sensitive DataPending

Server ActionsPending

Client RenderedPending

Server RenderedPending

CompositionPending

Global CSSPending

CSS ModulesPending

SassPending

Tailwind CSSPending

CSS in JSPending

ImagesPending

VideosPending

FontsPending

MetadataPending

ScriptsPending

Package BundlingPending

Lazy LoadingPending

AnalyticsPending

InstrumentationPending

OpenTelemetryPending

Static AssetsPending

Third Party LibrariesPending

Memory UsagePending

TypeScriptPending

PrettierPending

ESLintPending

Setting things UpPending

Environment VariablesPending

Markdown and MDXPending

Custom ServerPending

VitestPending

JestPending

PlaywrightPending

CypressPending

Preparing for ProductionPending

Deployment OptionsPending

React FrameworksPending

SSRPending

SPAPending

CSRPending

SSGPending

PagesPending

AppPending

Intercepting RoutesPending

Parallel RoutesPending

Static vs DynamicPending

StreamingPending

ReditectsPending

CachingPending

MiddlewarePending

Setting HeadersPending

Using CookiesPending

Use casesPending

Route MatcherPending

Fetching LocationsPending

Runtimes and TypesPending

Node.jsPending

EdgePending

InternationalizationPending

Node.js ServerPending

Docker ContainerPending

Static ExportPending

AdaptersPending

JavaScript Basics

Why React

Why Frontend Frameworks

SPA vs SSR

Introduction

Next.js

Why Next.js

Remix

Rendering Strategies

create-next-app

Loading and Streaming

Types of routers

Error States

Why use App Router?

Routing Patterns

Routing Terminology

API Endpoints

Rendering Pages

Structuring Routes

Layouts and Templates

Next.js Routing Basics

Client

Server

Memoization in Fetch

Revalidating Cached Data

React Cache

Revalidation Errors

Caching Data

Parallel vs Sequential

Preloading Data

Data Fetching Patterns

Handling Sensitive Data

Server Actions

Client Rendered

Server Rendered

Composition

Global CSS

CSS Modules

Sass

Tailwind CSS

CSS in JS

Images

Videos

Fonts

Metadata

Scripts

Package Bundling

Lazy Loading

Analytics

Instrumentation

OpenTelemetry

Static Assets

Third Party Libraries

Memory Usage

TypeScript

Prettier

ESLint

Setting things Up

Environment Variables

Markdown and MDX

Custom Server

Vitest

Jest

Playwright

Cypress

Preparing for Production

Deployment Options

Related Roadmaps

React Frameworks

SSR

SPA

CSR

SSG

Pages

App

Intercepting Routes

Parallel Routes

Static vs Dynamic

Streaming

Reditects

Caching

Middleware

Setting Headers

Using Cookies

Use cases

Route Matcher

Fetching Locations

Runtimes and Types

Node.js

Edge

Internationalization

Node.js Server

Docker Container

Static Export

Adapters

Scroll inside the canvas container above to browse the full roadmap.

Done

Learning

Skipped

Not Started