LESSON 2.2
The "use client" boundary
Learn key techniques and workflows in Next.js App Router in Depth.
10m
intermediate
14,470 students
Overview
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.
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
Pro Tip
If a whole page turned into a client component, look for one interactive import near the top of the tree.