0Pricing
Frontend Academy · Lesson

Server Components and Client Components

Understand React Server Components, when to add the 'use client' directive, and how to mix server-rendered HTML with interactive client islands.

Two Worlds in One App

React Server Components (RSC) let you split a tree between server-rendered and client-interactive parts. In Next.js App Router, components default to Server; opt into Client with 'use client'.

What Server Components Do

Server Components run only on the server. They can: fetch data directly, access the filesystem, use server-only secrets, render to HTML without shipping React to the client. They cannot: use hooks, manage state, handle events.

All lessons in this course

  1. Pages Router vs App Router
  2. Server Components and Client Components
  3. SSG SSR and ISR
  4. Next.js API Routes and Middleware
← Back to Frontend Academy