A Dad-of-Two Engineer's Development Diary 2児のパパ系Webエンジニア の開発日記

Claude Code の hooks 機能を使ってみたら、開発フローが一段階自動化された話

Claude Code のhooks機能でツール実行前後に自動コマンドを走らせた体験談です。設定方法と実際に使っているフックの例をまとめました。

AI
Claude Code hooks 機能のサムネイル

👀 結論から

Claude Code には hooks という機能があって、ファイル編集やコマンド実行などのイベントが発生したタイミングで、自動的にシェルコマンドを走らせることができます！

「AI がファイルを変えるたびに型チェックを自動実行」「セッション終了時に git status を表示」といった自動化が、設定ファイルに数行書くだけで実現できます。

実際に仕事のプロジェクトに設定してみたら、手動で繰り返していたコマンドが相当減りました(^o^)/

💡 hooks とはなにか

hooks は .claude/settings.json に設定する、イベント駆動の自動実行の仕組みです。

Claude Code でさまざまな操作が行われると、そのタイミングで「イベント」が発生します。

主なイベントの種類はこのあたりです:

  • PreToolUse — ツールが実行される直前
  • PostToolUse — ツールの実行が終わった直後
  • UserPromptSubmit — プロンプトを送信したとき
  • Stop — セッションが終了するとき

各イベントに対して「このコマンドを実行する」と書いておくだけです！

CLAUDE.md でプロジェクト固有のルールを設定するのと同じように、hooks は開発フローをさらにもう一段階カスタマイズするイメージで使えます(^^)

🔧 実際に設定したフックの例

私が実際に使っているフックをいくつか紹介します。

1. ファイルを編集したら型チェックを自動実行する

.claude/settings.json に以下を追加するだけです:

{
  "hooks": {
    "PostToolUse": [
      {
        "matcher": "Edit",
        "hooks": [
          {
            "type": "command",
            "command": "npm run typecheck 2>&1 | tail -5"
          }
        ]
      }
    ]
  }
}

matcher: "Edit" と書くことで、Claude Code がファイルを編集したときだけ発火する設定にできます。

これを入れてから、型エラーが出たときに Claude Code 自身がすぐ気づいて修正してくれるようになりました！

「型エラーに気づかず会話が進んでしまう」という状況がかなり減ります。

2. セッション終了時に git status を表示する

{
  "hooks": {
    "Stop": [
      {
        "hooks": [
          {
            "type": "command",
            "command": "git status --short"
          }
        ]
      }
    ]
  }
}

作業が終わったときに変更ファイルの一覧が自動表示されるので、コミット前の確認がかなり楽になります(・∀・)

✅ 使い始めてからの変化

一番変わったのは、**「AI が変更した後の確認作業を自分でやる場面が減った」**という点です。

以前は Claude Code がコードを書いてくれた後、手動でターミナルを開いてテストや型チェックを走らせていました。

フックを設定してからは、AI が変更を加えるたびに自動でチェックが入るので、問題に気づくのが相当早くなりました！

「ちゃんと型が通っているかな？」という不安をあまり感じなくなったのも、さりげなく大きな変化だと思っています(^^)

AI と会話しながら開発する流れが途切れにくくなったので、集中して作業できる時間が増えた感覚もあります。

🤔 気になった点

フックのコマンドが重い処理だと、毎回実行されるのでセッション全体がもたつくことがあります(・_・;)

特に PostToolUse に Edit マッチャーを設定すると、ファイルを1つ変えるたびにコマンドが走ります。

テストスイート全体を走らせるような重いコマンドは向いていないので、出力をパイプで絞る（tail -5 など）か、型チェックだけに絞るなど、コマンドの軽さを意識して設定するのが大事です。

また、まだ発展途上の機能なので、Claude Code のバージョンによって細かい挙動が変わることもあります。

📝 UserPromptSubmit でプロンプトに毎回情報を足す

PostToolUse と Stop に慣れたところで、UserPromptSubmit というイベントも試してみました。

これは自分がプロンプトを送信するたびに発火するフックで、標準出力の内容がそのままプロンプトに補足情報として追加される仕組みです。

私が設定したのは、今のブランチ名を毎回自動で伝える処理です。

{
  "hooks": {
    "UserPromptSubmit": [
      {
        "hooks": [
          {
            "type": "command",
            "command": "echo \"[現在のブランチ: $(git branch --show-current)]\""
          }
        ]
      }
    ]
  }
}

これを入れてから、「あれ、いまどのブランチで作業してたっけ」と自分が混乱したときも、AIの方は常に正確なブランチ名を把握してくれている状態になりました(^^)

もうひとつ覚えておくと便利なのが、matcher の書き方です。

PostToolUse や PreToolUse では matcher に正規表現が使えて、Edit|Write のように | で区切ると「EditまたはWrite」という条件にできますし、^Bash$ のように書けば「Bashツールだけに完全一致」という絞り込みもできます。

（UserPromptSubmit 自体は毎回必ず発火するので matcher の指定はできません）

最初は雑にすべてのツールに反応する設定をしていたんですが、matcher を使って絞り込むようになってから、余計なタイミングでコマンドが走ることがなくなりました！

パパ系Webエンジニア〜愛用ガジェット一覧 🛍️

AI開発・執筆に使っている作業デスク環境を楽天ROOMにまとめています ✨ デスク周りの参考にどうぞ 🙌

🙌 まとめ

Claude Code の hooks 機能、まだ使っていない人にはぜひ試してみてほしい機能です！

設定自体は .claude/settings.json に JSON を数行書くだけで、覚えることも多くないです。

「AI が変更したら型チェック」「セッション終了時に git status」といった小さな自動化を積み重ねるだけで、開発フローがかなりスムーズになります(｀・ω・´)

AIコーディングツールをより深く使いこなしたい人は、ぜひ hooks まで手を伸ばしてみてください🙌

※ hooks のイベント種類や仕様は今後拡張される可能性があります。最新情報は Claude Code 公式ドキュメント をご確認ください👀