ネクストでもClaude Codeをメインで使う方が増えてきました。
- Claude Code on Amazon Bedrockを導入してみた
- Claude Codeで始めるAIエージェント時代のバイブコーディング
- Claude Code を VS Code に導入してみた
- Claude Code を VSCode に導入した後に必ず行うべき初期設定
- ClaudeCodeをローカルで利用する方法 for Windows
- Amazon Bedrock 経由で Claude Code を導入する
同じ月で6本の記事が執筆されています。
社内でも関心の高さが窺えます。
が、Claude Code使っているうちにもっと社内ルールや文脈を考慮してほしいと思うタイミングが増えました。
- うちのAPI設計ルールに沿って書いてほしい
- レビュー観点を毎回同じにしたい
- デプロイ手順をAIにも理解させたい
すでに今のままでも君はすばらしいんですが、できたらもっといいなと思います。
毎回プロンプトで前提条件を説明するのは面倒です。
これを解決するのが今日ご紹介するSkillsです。
Skillsとは
Skillsはざっくり言うと、Claudeに追加できる業務用の拡張コマンドです。社内ルールや定型作業、開発フローをスキルとして登録し、いつでも呼び出せるようにする仕組みのことです。
例えば、以下のように呼び出せます。
/review-prあるいは
/next-api-guidelineSkillsを登録しておくと、Claudeが必要に応じて自動で使ったり、手動で呼び出したりできます。
ざっくりとした図解です。

はじめてのSkillsを作ってみる
ここでは例として、ネクスト社内でも役立ちそうなコードレビュー観点を統一するSkillを作ってみます。
大きな流れとしてはmdファイルを作成してしかるべき場所に置くだけです。
1. Skills用ディレクトリを作る
まずはローカルにSkillを置くフォルダを作ります。
mkdir -p ~/.claude/skills/review-helper2. SKILL.mdを書く
Skillsの本体は SKILL.md というファイルです。
---
name: review-helper
description: Pull Requestをレビューするときの観点チェックを行う
disable-model-invocation: true
---
# Review Helper
PRをレビューするときは以下を必ず確認してください。
1. 責務が分離されているか
2. 命名が明確か
3. エッジケースが考慮されているか
4. Next.js + MySQL構成に適しているか
5. パフォーマンス懸念がないか
最後に改善案を箇条書きで提示してください。ルールは自然言語で書かれていますが、冒頭にポイントがあります。
nameが/review-helperというコマンド名になるdisable-model-invocation: trueを付けると手動専用になる
3. 呼び出して使ってみる
Skillsはこう呼び出せます。
/review-helper src/app/api/user/route.tsするとClaudeがレビュー観点に沿って回答してくれます。
Review Helper(PRレビュー): src/app/api/user/route.ts
1) 責務が分離されているか
• GET と POST の中で DB接続・SQL・レスポンス整形まで全部やっていて、Route Handlerが少し太り気味に見えます。
lib/db.ts(接続)と services/user.ts(取得/作成)に切り出すと、読みやすさとテスト容易性が上がります。
• POST のバリデーションとエラー整形も同じ関数内に混ざっているので、validateCreateUserInput() と toErrorResponse() のように小さく分けると保守しやすいです。
...中略...
改善案(箇条書き)
• Route Handlerから DBアクセスとドメイン処理を分離し、services/user.ts に寄せる
• 入力バリデーション強化(trim、長さ、email形式、idの型チェック)+ 想定エラーは 400/404/409 を明示
• SQLを 必ずプレースホルダ化してインジェクション対策
• SELECT * をやめて 返却カラムをホワイトリストに(秘匿情報混入防止)
• MySQL接続は プール化して使い回し(lib/db.ts に集約)
• エラーレスポンス形式を統一し、ログとユーザー向けメッセージを分離Skillsは置き場所で変わります
Skillsは配置場所でスコープが変わります。
| 種類 | パス | 使える範囲 |
|---|---|---|
| Personal | ~/.claude/skills/… | 自分の全プロジェクト |
| Project | .claude/skills/… | そのリポジトリだけ |
| Enterprise | 管理者設定 | 全社員で共有可能 |
チームで共有したい場合は .claude/skills/ をGit管理するのが現実的です。
Skillsを社内ナレッジとして使う
Skillsの強い使い方は、単なるコマンドではなくAIに社内標準を覚えさせることです。
例えばAPI設計ルールのSkillsを作ってみます。
---
name: next-api-style
description: ネクスト社内のAPI設計ルール
user-invocable: false
---
- RESTfulに命名する
- エラー形式は統一する
- バリデーションを必ず入れるこれは背景知識としてClaudeに自動で効かせる用途です。
引数も渡せるテンプレSkills
Skillsは引数を受け取れます。
---
name: migrate-page
description: Next.jsページを新しい構成へ移行する
disable-model-invocation: true
argument-hint: "[ページ名] [移行先構成]"
---
次のページを移行してください:
- 対象ページ: `$0`
- 移行先構成: `$1`
作業内容:
1. ルーティングの挙動を壊さないこと
2. 必要ならテストも更新すること
3. 既存のUIを維持すること$0と$1には引数が入ります。
呼び出す際に引数を渡しましょう。
/migrate-page settings app-routerするとClaudeが受け取る指示は以下のようになります。
次のページを移行してください:
- 対象ページ: settings(第一引数)
- 移行先構成: app-router(第二引数)スクリプト付きSkillsで可視化もできる
Skillsはファイルを同梱できます。
codebase-visualizer/
├── SKILL.md
└── scripts/
└── foobar.pyClaudeにfoobar.pyの実行指示を出すことができます。
自然言語でプログラムを実行できるイメージです。
Skills導入のコツ
Skillsが発動しないとき
- descriptionが曖昧すぎると発動しない
- /skill-nameで手動実行してみる
- What skills are available?で認識されているか確認できる
Skillsが発動しすぎるとき
- descriptionを具体的にする
- disable-model-invocation: trueで手動専用にする
Skillsを探そう
- Anthropicの公式Skills – https://github.com/anthropics/skills
- BehiSecc/awesome-claude-skills – https://github.com/BehiSecc/awesome-claude-skills
公式には以下のようなSkillがあります。
| Skill名 | 概要 |
|---|---|
| algorithmic-art | p5.jsを用いたアルゴリズムアート生成 |
| brand-guidelines | Anthropicのブランドガイドラインを適用 |
| canvas-design | .pngおよび.pdf文書で美しいビジュアルアートを作成 |
| doc-coauthoring | 共同でドキュメントを作成するためのワークフローを案内 |
| docx | .docxドキュメントの文書作成・編集・分析機能 |
| frontend-design | 高いデザイン品質を備えた実用レベルのフロントエンドUIを作成 |
| internal-comms | 社内向け各種コミュニケーション文書作成を支援するリソース集 |
| mcp-builder | 高品質なMCPサーバー作成 |
| .pdfドキュメントの結合・分割、フォームの処理などを行う包括的なPDF操作ツールキット | |
| pptx | プレゼンテーションの作成、編集、分析 |
| skill-creator | 効果的なSkill作成ガイド |
| slack-gif-creator | Slack向けに最適化されたアニメーションGIFを作成するための知識とユーティリティ |
| theme-factory | スライド、ドキュメント、HTMLなどのテーマをスタイリングするためのツールキット |
| web-artifacts-builder | モダンなフロントエンドWeb技術(React、Tailwind CSS、shadcn/ui)を用いて、マルチコンポーネントのHTMLを作成するためのツールスイート |
| webapp-testing | Playwrightを使用したローカルWebアプリケーションとの対話およびテストのためのツールキット |
| xlsx | 数式、書式設定、データ分析、可視化をサポートした包括的なスプレッドシートの作成、編集、分析 |
これらをもとに拡張するのもいいかもしれません。
面倒なら
Claude Codeに任せてみてください。
このプロジェクトに必要なSkill.mdを作成or収集してください最後に
Claude Code Skillsを使うと、
- 開発ルール
- 手順
- 定型レビュー
- 社内ナレッジ
をAIに持たせることができます。
単なる補助ツールではなく、チームのやり方を理解して動けるAIエージェントになります。
ぜひ使ってみてください。
ここまで読んでいただき、ありがとうございます。もしこの記事の技術や考え方に少しでも興味を持っていただけたら、ネクストのエンジニアと気軽に話してみませんか。
- 選考ではありません
- 履歴書不要
- 技術の話が中心
- 所要時間30分程度
- オンラインOK

