update-docsスキルでNext.jsのドキュメント更新を効率化する方法
Skill Gallery Team•2026年1月31日•5 分で読める
Next.jsにコントリビュートする際、コード変更に対応するドキュメントの更新は見落とされがちです。どのドキュメントファイルを更新すべきか、フォーマットのルールは何か、把握するのに手間がかかります。
この記事では、Next.jsリポジトリのupdate-docsスキルを使って、コード変更に基づいたドキュメント更新を効率的に行う方法を解説します。
このスキルは何をしてくれるのか
update-docsは、Next.jsのコード変更からドキュメント更新が必要な箇所を特定し、更新作業をガイドするスキルです：
- ソースコードとドキュメントのマッピング（CODE-TO-DOCS-MAPPING.md参照）
git diffによる変更箇所の分析- 既存ドキュメントの更新、または新機能ドキュメントの雛形作成
- MDXフォーマット規約の適用（フロントマター、コードブロック、ルーター別コンテンツ）
Next.jsコアにコントリビュートする開発者に向いています。
インストール方法
前提条件
- Claude Codeがインストール済みであること
- Next.jsリポジトリのソースコードへのアクセス
インストールコマンド
claude mcp add github.com/vercel/next.js/tree/canary/.claude/skills/update-docs
使い方
基本的な使い方
コード変更後に以下のように指示します：
このコード変更に対応するドキュメントを更新して
スキルは以下の手順で動作します：
git diff canary...HEADで変更箇所を分析- CODE-TO-DOCS-MAPPINGで対応するドキュメントファイルを特定
- 既存ドキュメントの更新箇所を提示
- MDXフォーマット規約に従って更新を実施
ソースコードとドキュメントのマッピング例
| ソースコードパス | ドキュメント |
|---|---|
packages/next/src/client/components/ | コンポーネントAPIリファレンス |
packages/next/src/server/ | 関数APIリファレンス |
ドキュメントの規約
- フロントマターに
titleとdescriptionが必須 - コードブロックには
filename属性と、TypeScript/JavaScript切り替え用のswitcherを付与 - App RouterとPages Router固有のコンテンツは
<AppOnly>/<PagesOnly>コンポーネントで分離
pnpm lint
pnpm prettier-fix
知っておくべき注意点
canaryブランチが基準
変更の差分はcanaryブランチとの比較で分析されます。mainブランチではなくcanaryが基準である点に注意してください。
MDX形式の厳密なフォーマット
コードブロックのswitcherやfilename属性など、フォーマットルールが細かく定められています。スキルがこれらを自動的に適用します。
新機能ドキュメントの雛形作成
既存ドキュメントの更新だけでなく、新機能の場合はドキュメントの雛形（scaffolding）を作成する機能もあります。
まとめ
update-docsスキルを使うと、Next.jsのコード変更に対応するドキュメント更新を、マッピングとフォーマット規約に沿って効率的に進められます。コントリビュート時のドキュメント更新漏れの防止に活用してください。
関連リンク
update-docsnextjsdocumentationvercelmdx