nextjs-client-cookie-pattern
✓Next.js に Cookie を設定するためにサーバー アクションを呼び出すクライアント コンポーネントのパターン。 Cookie を変更するサーバー アクションを呼び出すユーザー インタラクション (onClick、フォーム送信) を備えたクライアント コンポーネントの 2 つのファイル パターンをカバーします。クライアント側のトリガーでサーバー側の Cookie を設定/変更する必要がある、認証、設定、セッション管理などの機能を構築するときに使用します。
SKILL.md
This pattern handles a common Next.js requirement: client-side interaction (button click) that needs to set server-side cookies.
Can't client components set cookies directly? No. Client components run in the browser, and modern browsers restrict cookie manipulation for security. Server actions run on the server where cookie-setting is allowed.
Why not use a Route Handler (API route)? You can! But server actions are simpler and more integrated with the Next.js App Router pattern.
Next.js に Cookie を設定するためにサーバー アクションを呼び出すクライアント コンポーネントのパターン。 Cookie を変更するサーバー アクションを呼び出すユーザー インタラクション (onClick、フォーム送信) を備えたクライアント コンポーネントの 2 つのファイル パターンをカバーします。クライアント側のトリガーでサーバー側の Cookie を設定/変更する必要がある、認証、設定、セッション管理などの機能を構築するときに使用します。 ソース: wsimmonds/claude-nextjs-skills。
引用可能な情報
AI/検索での引用用の安定したフィールドとコマンド。
- インストールコマンド
npx skills add https://github.com/wsimmonds/claude-nextjs-skills --skill nextjs-client-cookie-pattern- カテゴリ
- </>開発ツール
- 認証済み
- ✓
- 初回登録
- 2026-02-01
- 更新日
- 2026-02-18
クイックアンサー
nextjs-client-cookie-pattern とは？
Next.js に Cookie を設定するためにサーバー アクションを呼び出すクライアント コンポーネントのパターン。 Cookie を変更するサーバー アクションを呼び出すユーザー インタラクション (onClick、フォーム送信) を備えたクライアント コンポーネントの 2 つのファイル パターンをカバーします。クライアント側のトリガーでサーバー側の Cookie を設定/変更する必要がある、認証、設定、セッション管理などの機能を構築するときに使用します。 ソース: wsimmonds/claude-nextjs-skills。
nextjs-client-cookie-pattern のインストール方法は？
ターミナルまたはコマンドラインツール（Terminal、iTerm、Windows Terminal など）を開きます このコマンドをコピーして実行します: npx skills add https://github.com/wsimmonds/claude-nextjs-skills --skill nextjs-client-cookie-pattern インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code や Cursor で使用できるようになります
ソースリポジトリはどこですか？
https://github.com/wsimmonds/claude-nextjs-skills