💻 Claude Code入門
|
📖 7分
フックとカスタムコマンドで自動化する
フック(Hooks)とは
Claude Codeのフックシステムは、特定のアクション(ツール呼び出し)の前後にカスタムスクリプトを自動実行する仕組みです。これにより、繰り返し行う作業を自動化したり、安全性チェックを追加したりできます。
フックの種類
| フックタイプ | タイミング | 用途 |
|---|---|---|
PreToolUse | ツール実行の前 | 実行前のバリデーション、ログ記録 |
PostToolUse | ツール実行の後 | 結果の検証、通知、後処理 |
Notification | 通知発生時 | カスタム通知の送信 |
Stop | Claude応答完了時 | 応答後の自動アクション |
SubagentStop | サブエージェント完了時 | サブエージェント終了後の処理 |
フックの設定方法
フックは .claude/settings.json ファイルで設定します。
{
"hooks": {
"PreToolUse": [
{
"matcher": "Bash",
"hooks": [
{
"type": "command",
"command": "jq -r '.tool_input.command' | head -c 200 | xargs -I{} echo \"実行コマンド: {}\""
}
]
}
],
"PostToolUse": [
{
"matcher": "Write",
"hooks": [
{
"type": "command",
"command": "echo \"ファイルが作成/更新されました\""
}
]
}
]
}
}
実用的なフックの例
例1: ファイル変更時にリンターを自動実行
{
"hooks": {
"PostToolUse": [
{
"matcher": "Write|Edit",
"hooks": [
{
"type": "command",
"command": "jq -r '.tool_input.file_path' | xargs -I{} npx eslint --fix {} 2>/dev/null || true"
}
]
}
]
}
}
例2: コミット前にテストを自動実行
{
"hooks": {
"PreToolUse": [
{
"matcher": "Bash(git commit)",
"hooks": [
{
"type": "command",
"command": "npm test"
}
]
}
]
}
}
カスタムスキル(スラッシュコマンド)
プロジェクト固有のスラッシュコマンドを作成することもできます。.claude/skills/(または.claude/commands/) ディレクトリにMarkdownファイルを配置します。
# .claude/skills/(または.claude/commands/)deploy.md
デプロイの手順を実行してください:
1. テストを実行して全てパスすることを確認
2. ビルドを実行
3. dist/ フォルダの内容をサーバーにアップロード
4. デプロイ後の動作確認URLを表示
これで /deploy コマンドが使えるようになります。
/deploy
カスタムコマンドの作成例
# .claude/skills/(または.claude/commands/)new-component.md
以下の手順で新しいReactコンポーネントを作成してください:
1. src/components/ に $ARGUMENTS.tsx を作成
2. Props型を定義
3. テストファイルを src/components/__tests__/$ARGUMENTS.test.tsx に作成
4. Storyファイルを src/stories/$ARGUMENTS.stories.tsx に作成
$ARGUMENTS にはコマンドの引数が入ります。
/new-component Button
自動化のベストプラクティス
- 小さく始める: まずは1つのシンプルなフックから始める
- エラーハンドリング: フックのコマンドでエラーが出てもClaude Codeの動作を止めないようにする
- チームで共有:
.claude/skills/(または.claude/commands/)はGitで管理し、チーム全体で共有する - ドキュメント化: カスタムコマンドの使い方をCLAUDE.mdに記載する
💡 キーポイント: フックとカスタムコマンドを活用すると、チーム固有のワークフローをClaude Codeに組み込めます。特にカスタムスキル(スラッシュコマンド)(.claude/skills/(または.claude/commands/))は設定が簡単で効果が高いので、まずはここから始めてみましょう。