Layouts (Client Component)
Nested Layouts
Grouped Layouts
Streaming with Suspense
Root Layouts soon
File Conventions (Client Component)
Loading
Error
Components (Client Component)
Hooks
Client Context
Component Tree
Styling (Client Component)
CSS and CSS-in-JS
client-component
/
Server Component Boundary
Counter Context Provider [Client Component]
Server Component Boundary
(Client Component) Home
(Client Component)Electronics
(Client Component)Clothing
(Client Component)Books
Counter Context [Client Component]
0 Clicks (Client Component)
Client Context (server component)
Pass context
between Client Components
that cross the Server/Client Component boundary.
Click the counter and navigate between pages.
Because the context provider is above the nested layouts and pages the number of clicks remains constant even between navigations.
Learn more
Created by the
Next.js
team at
Vercel
.
View the code
or
deploy your own
.