You are viewing a free preview of this lesson.
Subscribe to unlock all 10 lessons in this course and every other course on LearningBro.
One of Next.js's most powerful features is React Server Components (RSC). Components run on the server by default, reducing the JavaScript sent to the browser and enabling direct data access. This lesson covers server vs client components, the "use client" directive, server actions, fetching data in server components, caching, and revalidation.
| Feature | Server Component (default) | Client Component ("use client") |
|---|---|---|
| Runs on | Server only | Server (SSR) + Browser |
| JavaScript sent to browser | None | Yes — included in the bundle |
| Can access DB / file system | Yes | No |
Can use hooks (useState, etc.) | No | Yes |
| Can use event handlers | No | Yes |
| Can render server components | Yes | No (can accept as children) |
Use Server Components for: Use Client Components for:
├── Fetching data ├── Interactivity (onClick, onChange)
├── Accessing backend resources ├── useState, useEffect, useReducer
├── Rendering static/dynamic content ├── Browser APIs (localStorage, etc.)
└── Keeping secrets on the server └── Third-party client libraries
Subscribe to continue reading
Get full access to this lesson and all 10 lessons in this course.