Claudeコードセットアップ究極ガイド:フック、スキル&アクション

Claude Code セットアップ完全ガイド:フック、スキル&アクション

Claude Code は、普通のコードベースを読み、書き、リファクタリングし、さらにはチケット管理までもできるチームメンバーに変えます。ソロ開発者であれ大規模チームであれ、このチュートリアルは以下を含むフルハンズオン構成を提供します: * CLAUDE.md でのプロジェクトメモリ * 実行時フック、環境変数、コマンド制限 * パターン・テスト・アーキテクチャの再利用可能「スキル」 * JIRA、GitHub、Slack などの MCP サーバー * 実時間診断の LSP 統合 * カスタムエージェントとスラッシュコマンド * PR レビュー、品質チェック、スケジュールジョブの GitHub Actions


1. なぜ Claude Code なのか?

従来の LLM アシスタントはコードをプレーンテキストとして読むことが多いです。Claude Code はそれを変えます:

機能 利点
プロジェクトメモリ Claude はスタック、スタイルガイド、共通パターンを記憶します。
フック フォーマット、テスト、ブランチ保護を自動化します。
スキル テスト、GraphQL、デザインシステムコンポーネントを書く方法を Claude に教えます。
エージェント PR レビュー、デバッグ、ワークフロー調整専用のヘルパーです。
MCP サーバー JIRA、GitHub、Slack など外部ツールと JSON 設定で接続します。
LSP コード生成中にリアルタイムの型情報と診断を提供します。

これらの要素により、Claude は単なるコード生成ツールではなく 信頼できるチームメイト となります。


2. プロジェクト構成概要

your‑project/
├── .claude/
│   ├── agents/          # カスタム AI エージェント
│   ├── commands/        # スラッシュコマンド
│   ├── hooks/           # フックスクリプト & ルール
│   ├── skills/          # ドメイン固有知識
│   ├── settings.json    # グローバルフック & 環境変数
│   └── settings.md      # 読みやすいドキュメント
├── .mcp.json            # MCP サーバー設定 (JIRA, GitHub など)
├── .github/workflows/   # GitHub Actions
├── CLAUDE.md            # プロジェクトメモリ – トップレベル
└── README.md

Tip:ユーザー固有の上書きを .claude/settings.local.jsonCLAUDE.local.md に保存し、Git で除外設定してください。


3. クイックスタート:雛形作成

mkdir -p .claude/{agents,commands,hooks,skills}

# Basic CLAUDE.md – edit to suit your stack
cat <<'EOF' > CLAUDE.md
# My Awesome Project

## Stack
- React
- TypeScript
- Node.js

## Key Directories
- src/components/  # UI
- src/api/         # API layer
- tests/           # Jest tests

## Code Style
- TypeScript strict mode
- Prefer interfaces over types
- No `any` – use `unknown`
EOF

# Basic settings.json with a simple PreToolUse hook
cat <<'EOF' > .claude/settings.json
{
  "hooks": {
    "PreToolUse": [
      {
        "matcher": "Edit|Write",
        "hooks": [
          {
            "type": "command",
            "command": "[ \"$(git branch --show-current)\" != \"main\" ] || { echo '{\"block\": true, \"message\": \"Cannot edit on main branch\"}' >&2; exit 2; }",
            "timeout": 5
          }
        ]
      }
    ]
  }
}
EOF

git add -A && git commit -m "Initial Claude Code configuration" を実行して構成を保存します。


4. プロジェクトメモリ:CLAUDE.md

CLAUDE.md は Claude の永続メモリで、各セッションでロードされます。簡潔に、しかし完全に保ちましょう:

  • スタック & アーキテクチャ – スタック概要。
  • 主なコマンドnpm run testnpm run lintnpm run build
  • コードスタイルガイドライン – Lint 規則、型の厳格性。
  • 重要ディレクトリ – コンポーネント、ユーティリティ、テストの場所。
  • 特別な制約 – 例:main ブランチでの編集禁止。

Claude はこのファイルを最初に読むので、最も重要な情報は冒頭に配置してください。


5. フック & 環境:.claude/settings.json

フックはツール呼び出しやユーザー入力を補足できます。典型的な設定は以下のようになります:

フックイベント 一般的な使用例
PreToolUse 保護ブランチでの編集禁止、コミット前にテスト実行を要求
PostToolUse コード変更後にフォーマットやテスト実行
UserPromptSubmit スキル評価エンジンをトリガ
Stop マルチステッププロセスを継続するか判定

例:main での編集をブロック

"PreToolUse": [
  {"matcher": "Edit|Write", "hooks": ["if [ \"$(git branch --show-current)\" != \"main\" ]; then echo 'Allowed'; else echo 'Blocked'; fi"]}
]

秘密情報の環境変数も追加できます(JIRA API トークン等)。ファイルはコミット対象ですが、${VAR} プレースホルダで実行時に値がロードされます。


6. スキル:再利用可能ドメイン知識

スキルは Markdown ファイルで、Claude にあなたのスタイルでコードを書く方法を教えます。各スキルは .claude/skills/{skill-name}/SKILL.md の下に置きます。

スキルフロントマター例

---
name: testing-patterns
description: Jest testing patterns for this project. Use when writing tests, creating mocks, or following TDD workflow.
---

description フィールドは重要です – Claude はこれを見てスキルを起動すべきか判断します。自然言語キーワード(testjestmock 等)を含めてください。

スキル内容例

# Testing Patterns

## Arrange-Act-Assert

```ts
// Arrange
const mockUser = getMockUser();

// Act
const result = login(mockUser);

// Assert
expect(result).toBeTruthy();

Mocking

Prefer factory functions over global mocks to keep tests deterministic.


新スキル追加手順

  1. .claude/skills/{skill-name}/SKILL.md を作成。
  2. 簡潔な説明を書きます。
  3. コード例を実装。
  4. 必要なら skill-rules.json を更新しトリガをマッピング。
  5. スキルディレクトリを Git に追加しコミット。

7. スキル評価フック

ユーザーがプロンプトを送信すると、UserPromptSubmit フックが小さなエンジンを実行し以下を探します:

  • キーワード – 例:write test
  • パスパターン – 例:src/components/*
  • 意図パターン – 共通リクエストをキャプチャする正規表現。
  • ディレクトリマッピング – ファイルパスをスキル名にリンク。

フックは JSON を出力し、起動すべきスキルを指定します。例:

{"activate": ["testing-patterns", "react-ui-patterns"]}

Tipskill-rules.json はシンプルに保ち、新しいパターンが出てきたら追加してください。


8. MCP サーバー:外部ツール接続

MCP(Model Context Protocol)サーバーは Claude に JIRA、GitHub、Slack、Sentry、Postgres などのサービスへ直接アクセスさせます。.mcp.json で設定します。

例:JIRA & GitHub

{
  "mcpServers": {
    "jira": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "@anthropic/mcp-jira"],
      "env": {"JIRA_HOST": "${JIRA_HOST}", "JIRA_EMAIL": "${JIRA_EMAIL}", "JIRA_API_TOKEN": "${JIRA_API_TOKEN}"}
    },
    "github": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "@anthropic/mcp-github"],
      "env": {"GITHUB_TOKEN": "${GITHUB_TOKEN}"}
    }
  }
}

実際のトークンは環境変数か .env ファイルに保存し、コミットしないでください。

/ticket コマンド

スラッシュコマンド /ticket は JIRA イシューを読み、ブランチを生成し、要求された機能を実装し、チケットを自動で閉じられます。詳細手順は .claude/commands/ticket.md にあります。


9. LSP サポート

LSP プラグインを追加して Claude にリアルタイム診断を提供します:

// .claude/settings.json
"enabledPlugins": {
  "typescript-lsp@claude-plugins-official": true,
  "pyright-lsp@claude-plugins-official": true
}

LSP バイナリ(例:npm i -g typescript-language-server)をインストールしてください。LSP は Claude に以下を提供します:

  • 診断 – 編集時に型エラー。
  • IntelliSense – 関数シグネチャと型情報。
  • ナビゲーション – 定義へジャンプ。
  • 補完 – 文脈に応じた提案。

10. エージェント & コマンド

エージェント

エージェントは特化した助手です。code-reviewer エージェントは自動でチェックリストを走らせ、プルリクエストにコメントします。

---
name: code-reviewer
description: Reviews TypeScript code for style, safety, and tests.
model: opus
---

コマンド

スラッシュコマンドはカスタムワークフローを実行します。例:/pr-review は PR を展開し、変更をレビューし、コメントを残します。

---
description: Review current PR using standard checklist.
allowed-tools: Bash(git:*), Read, Grep
---

.claude/commands/ 配下にマークダウンファイルを作成し、GitHub Actions で参照してください。


11. GitHub Actions 自動化

品質ゲート、ドキュメント同期、依存関係監査をワークフローで自動化します。典型例は以下:

  • Auto PR Review – PR イベントで Claude の code-reviewer を実行。
  • Scheduled Docs Sync – 毎月実行し、ドキュメントが最新コードを反映。
  • Weekly Code Quality – ランダムディレクトリスキャンと自動修正。
  • Bi‑weekly Dependency Audit – テスト検証付き安全更新。

最小 PR レビュー ワークフローの例:

name: PR - Claude Review
on:
  pull_request:
    types: [opened, synchronize, reopened]
jobs:
  review:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
        with:
          fetch-depth: 0
      - uses: anthropics/claude-code-action@beta
        with:
          anthropic_api_key: ${{ secrets.ANTHROPIC_API_KEY }}
          model: claude-opus-4-5-20251101
          prompt: |
            Review this PR using .claude/agents/code-reviewer.md standards.
            Run `git diff origin/main...HEAD` to see changes.

ANTHROPIC_API_KEYRepository Secrets に追加して API アクセスを有効にしてください。


12. ベストプラクティス

  1. CLAUDE.md から開始 – 簡潔だが完全に。
  2. 段階的にスキルを構築 – 高インパクトのパターンに重点。
  3. フックで反復作業を自動化 – 手動の lint / テスト失敗を排除。
  4. 複雑なワークフローにはエージェントを作成 – バグ triage、PR 要約など。
  5. GitHub Actions で自動化 – 定期的な品質スイープとドキュメント同期。
  6. 設定をバージョン管理 – 個人オーバーライドを除きすべてコミット。
  7. 機密データを保護 – 環境変数を使用し、シークレットはコミットしない。
  8. コストを測定 – コスト推定表を使用し予測可能に。

13. まとめ

この構成でリポジトリは以下のように変わります:

  • 自己認識 – Claude はスタック、スタイル、慣習を理解。
  • 自動化 – コード整形、テスト、品質ゲートが自動で実行。
  • 接続性 – チケット、PR、チャットが Claude のワークフローへ直接結合。
  • 拡張性 – 新スキル、エージェント、コマンドは数分で追加可能。

リポジトリをクローンし、スニペットを自分のスタックに合わせてカスタマイズし、Claude にあなたが知らなかった仲間になってもらいましょう。

Happy coding!

この記事を共有