Nextjs Tutorial
Learn Nextjs interactively. Read the concept and write code to practice.
1. Next.js Introduction
Next.js is a React framework for building full-stack web applications. You use ...
2. Next.js App Router
Next.js introduced the App Router built on React Server Components. In the App ...
3. Next.js Pages and Layouts
Pages and Layouts are the core of routing. - **Page**: A page is UI that is uni...
4. Next.js Linking and Navigation
To navigate between routes in Next.js, you should use the `<Link>` component. `...
5. Next.js Server Components
In the App Router, components are React Server Components by default. Server Co...
6. Next.js Client Components
Client Components allow you to write interactive UI that is rendered on the clie...
7. Next.js Data Fetching (Server)
Next.js extends the native `fetch` Web API to allow you to configure caching and...
8. Next.js Dynamic Routes
When you don't know the exact segment names ahead of time and want to create rou...
9. Next.js Static & Dynamic Rendering
**Static Rendering (Default)** With Static Rendering, routes are rendered at bui...
10. Next.js Image Component
The Next.js Image component (`next/image`) is an extension of the HTML `<img>` e...
11. Next.js API Routes (Route Handlers)
Route Handlers allow you to create custom request handlers for a given route usi...
12. Next.js Metadata
Next.js has a Metadata API that can be used to define your application metadata ...