Context providers
Provider를 Client Component로 만들고, Server layout에서 children 범위만 감싸는 실전 패턴을 보여줍니다.
파일 구조
context-providers/
├── page.tsx
└── demo/
├── layout.tsx ← Server layout
├── theme-provider.tsx ← Client provider
├── page.tsx
├── about/page.tsx
└── ui/theme-consumer.tsx핵심 파일 코드
// demo/layout.tsx
import ThemeProvider from './theme-provider'
export default function Layout({ children }) {
return <ThemeProvider>{children}</ThemeProvider>
}