nextjs-server-client-components

SKILL.md

Provide comprehensive guidance for choosing between Server Components and Client Components in Next.js App Router, including cookie/header access, searchParams handling, pathname routing, and React's 'use' API for promise unwrapping.

CRITICAL RULE: This codebase has @typescript-eslint/no-explicit-any enabled. Using any will cause build failures.

All components in the App Router are Server Components by default. No directive needed.

Next.js App Router でサーバー コンポーネントとクライアント コンポーネントのどちらを選択するためのガイド。 useSearchParams (Suspense + 'use client' が必要)、ナビゲーション (リンク、リダイレクト、useRouter)、Cookie/ヘッダー アクセス、および 'use client' ディレクティブに重要です。プロンプトに useSearchParams、Suspense、ナビゲーション、ルーティング、リンク コンポーネント、リダイレクト、パス名、searchParams、Cookie、ヘッダー、非同期コンポーネント、または「クライアントの使用」が記載されている場合にアクティブになります。サーバー/クライアント API の混在を避けるために不可欠です。 ソース: wsimmonds/claude-nextjs-skills。

原文を見る