LESSON 2.2

The "use client" boundary

10:34·14,470 learners

Mira Kovac

Resuming from 05:17

In this lesson you will

Place the directive at the boundary, not on every file
Push interactivity to the leaves to keep the bundle small
Spot the accidental import that drags the server tree client-side

The directive does not mark one component as interactive — it marks the entry point to a client subtree. Everything imported below it goes to the browser too.

What this lesson covers

Place the directive at the boundary, not on every file
Push interactivity to the leaves to keep the bundle small
Spot the accidental import that drags the server tree client-side

This lesson sits in Server and Client Components, part of Next.js App Router in Depth. It assumes what came before it and leads directly into the next lesson in the module.

PRO TIP

If a whole page turned into a client component, look for one interactive import near the top of the tree.

UP NEXT

2.3 · Passing data across the boundary

06:19

Next.js App Router in Depth

33%

2.1 What server components actually do15:48 2.2 The "use client" boundary10:34 2.3 Passing data across the boundary06:19

Every lesson, searchable to the second.

PRIVACY · TERMS · CONTACT