·cache-components
</>

cache-components

laguagu/claude-code-nextjs-skills

Next.js キャッシュ コンポーネントと部分事前レンダリング (PPR) に関する専門家によるガイダンス。 **プロアクティブ アクティベーション**: next.config.ts/next.config.js に `cacheComponents: true` がある Next.js プロジェクトで作業する場合、このスキルは自動的に使用されます。この構成が検出されたら、キャッシュ コンポーネント パターンとベスト プラクティスをすべての React サーバー コンポーネント実装に積極的に適用します。 **検出**: Next.js プロジェクトのセッションの開始時に、next.config の `cacheComponents: true` を確認してください。有効にした場合、このスキルのパターンは、すべてのコンポーネントの作成、データのフェッチ、およびキャッシュの決定をガイドする必要があります。 **使用例**: 「use queue」ディレクティブの実装、cacheLife() によるキャッシュ有効期間の構成、cacheTag() によるキャッシュ データのタグ付け、updateTag()/revalidateTag() によるキャッシュの無効化、静的コンテンツと動的コンテンツの境界の最適化、キャッシュの問題のデバッグ、およびキャッシュ コンポーネントの実装のレビュー。

13インストール·0トレンド·@laguagu

インストール

$npx skills add https://github.com/laguagu/claude-code-nextjs-skills --skill cache-components

SKILL.md

Auto-activation: This skill activates automatically in projects with cacheComponents: true in next.config.

When starting work in a Next.js project, check if Cache Components are enabled:

If cacheComponents: true is found, apply this skill's patterns proactively when:

Next.js キャッシュ コンポーネントと部分事前レンダリング (PPR) に関する専門家によるガイダンス。 **プロアクティブ アクティベーション**: next.config.ts/next.config.js に `cacheComponents: true` がある Next.js プロジェクトで作業する場合、このスキルは自動的に使用されます。この構成が検出されたら、キャッシュ コンポーネント パターンとベスト プラクティスをすべての React サーバー コンポーネント実装に積極的に適用します。 **検出**: Next.js プロジェクトのセッションの開始時に、next.config の `cacheComponents: true` を確認してください。有効にした場合、このスキルのパターンは、すべてのコンポーネントの作成、データのフェッチ、およびキャッシュの決定をガイドする必要があります。 **使用例**: 「use queue」ディレクティブの実装、cacheLife() によるキャッシュ有効期間の構成、cacheTag() によるキャッシュ データのタグ付け、updateTag()/revalidateTag() によるキャッシュの無効化、静的コンテンツと動的コンテンツの境界の最適化、キャッシュの問題のデバッグ、およびキャッシュ コンポーネントの実装のレビュー。 ソース: laguagu/claude-code-nextjs-skills。

原文を見る

引用可能な情報

AI/検索での引用用の安定したフィールドとコマンド。

インストールコマンド
npx skills add https://github.com/laguagu/claude-code-nextjs-skills --skill cache-components
カテゴリ
</>開発ツール
認証済み
初回登録
2026-02-01
更新日
2026-02-18

クイックアンサー

cache-components とは?

Next.js キャッシュ コンポーネントと部分事前レンダリング (PPR) に関する専門家によるガイダンス。 **プロアクティブ アクティベーション**: next.config.ts/next.config.js に `cacheComponents: true` がある Next.js プロジェクトで作業する場合、このスキルは自動的に使用されます。この構成が検出されたら、キャッシュ コンポーネント パターンとベスト プラクティスをすべての React サーバー コンポーネント実装に積極的に適用します。 **検出**: Next.js プロジェクトのセッションの開始時に、next.config の `cacheComponents: true` を確認してください。有効にした場合、このスキルのパターンは、すべてのコンポーネントの作成、データのフェッチ、およびキャッシュの決定をガイドする必要があります。 **使用例**: 「use queue」ディレクティブの実装、cacheLife() によるキャッシュ有効期間の構成、cacheTag() によるキャッシュ データのタグ付け、updateTag()/revalidateTag() によるキャッシュの無効化、静的コンテンツと動的コンテンツの境界の最適化、キャッシュの問題のデバッグ、およびキャッシュ コンポーネントの実装のレビュー。 ソース: laguagu/claude-code-nextjs-skills。

cache-components のインストール方法は?

ターミナルまたはコマンドラインツール(Terminal、iTerm、Windows Terminal など)を開きます このコマンドをコピーして実行します: npx skills add https://github.com/laguagu/claude-code-nextjs-skills --skill cache-components インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code や Cursor で使用できるようになります

ソースリポジトリはどこですか?

https://github.com/laguagu/claude-code-nextjs-skills