スクリーンショット解説

Claude Code を GitHub Actions に組み込む:@claude で Issue トリアージと PR 自動レビュー

Claude Code のセッションで /install-github-app を一度実行すれば、ワークフローファイルは向こうが書いてくれます。以降は Issue や PR のコメントに @claude と書くだけで、Agent が GitHub Actions のジョブとして動き、リポジトリを読み、コードを直し、日付入りのブランチに push し、もう一方のワークフローがマージ前に diff をレビューします。

Claude bot reply on a GitHub issue triggered by an @claude can you fix this comment, showing a five item Todo List and the diagnosis that the site title is an h1 element without a link
@claude と一言書いた後に起きること:ボットの返信、その場で更新される TODO リスト、そして最後にブランチ。

16 ステップの図解、読む目安は約 6 分。各ステップに、元動画の該当秒数へ飛ぶリンクがあります。

要点

GitHub CLI を入れて gh auth login しておき、Claude Code の中で /install-github-app を実行します。対象リポジトリを聞かれ、github.com/apps/claude が開いて認可、続いて 2 つのワークフローにチェックを入れます——Issue と PR コメントの @claude に応答する @Claude Code、新しい PR を毎回レビューする Claude Code Review——そして Claude サブスクリプションで長期トークンを作るか、自分の API キーを入力するかを選びます。既定ブランチへの直接コミットはなく、セットアップはワークフローファイルを載せた PR として届きます。その PR 本文に allowed_tools の行があり、npm を実行させたければここで追加します。マージ後に Issue へ @claude と書くと、ボットが同じスレッドに TODO リストを出し、claude/issue-<番号>-<タイムスタンプ> ブランチ上でコードを直し、最後に Create PR リンクを貼ります。その PR を開いた瞬間にレビュー側のワークフローが走り、diff を項目ごとに採点します。

元動画

このページは Net Ninja の walkthrough に沿って、Claude GitHub App の導入から、ありふれたバグ報告 1 件を動かすところまでを 1 枚ずつのスクリーンショットで組み直しています。画像はいずれも、動画に映った正確な秒数へ戻れます。

スクリーンショットは元動画のフレームで、著作者を明記しています。文章は当サイト独自の書き下ろしです。手順は動画と Claude Code 公式ドキュメントを突き合わせて確認済み(2026 年 9 月)。

その前に

導入作業は Claude Code の内側から起動しますが、GitHub に対する操作は GitHub CLI 経由です。先にインストールとログインを済ませておきます。

  1. 1

    GitHub CLI を入れてログインしておく

    Claude GitHub App の導入は Claude Code の内側から始まりますが、GitHub に対する処理は GitHub CLI を通ります。動画が開いているのは cli.github.com のマニュアルページで、macOS なら Homebrew、Windows なら winget で gh を入れ、gh auth login で、この後のインストールを引き受けるアカウントに認証しておきます。動画では、これが開始前の唯一の前提条件として扱われています。

    GitHub CLI manual on cli.github.com open at the Configuration section where gh auth login signs in the account that Claude Code later uses to install the Claude GitHub App
    gh auth login を一度打てば、以降の導入はアカウントを自動で見つけます。1:06 の映像を見る
  2. 2

    繋ぎ込みたいリポジトリで /install-github-app を実行する

    対象リポジトリで Claude Code を開きます——動画では Visual Studio Code のパネル内で動かしていて、セッションの先頭に作業ディレクトリが表示されています——そこに /install-github と入力し始めると、組み込みコマンドの一覧に /install-github-app が現れ、説明は "Set up Claude GitHub Actions for a repository" と出ます。コマンド名を覚えておく必要はなく、この後は補完がやってくれます。

    Claude Code session inside Visual Studio Code with /install-github half typed and the autocomplete row /install-github-app described as Set up Claude GitHub Actions for a repository
    組み込みのスラッシュコマンドなので、.claude に何か足す必要はありません。1:18 の映像を見る
  3. 3

    ワークフローを入れるリポジトリを決める

    最初のプロンプトは "Install GitHub App / Select GitHub repository"。Claude Code は "Use current repository" として、いまいるフォルダの origin を提示します——ここは iamshaunjp/Claude-Code-Tutorial——もう一方の "Enter a different repository" では owner/repo か github.com のフル URL を入力できます。矢印キーで選択し、Enter で進みます。

    Claude Code Install GitHub App prompt asking which repository to configure, offering the current repository iamshaunjp/Claude-Code-Tutorial or entering a different owner and repo
    対象リポジトリはここで確定します。直後の App 認可はこの 1 件にスコープされます。1:30 の映像を見る

GitHub 側で Claude に認可する

ここからの 4 回の選択が、この Agent に触れる範囲を決めます。どのリポジトリか、どの権限か、どのワークフローか、そして誰の課金か。

  1. 4

    ブラウザには Claude GitHub App の一覧ページが開く

    ターミナルが github.com/apps/claude を開いてくれます。この App は anthropics 組織のもので、説明には「Pull Request と Issue から Claude Code を実行し、レビューアの指摘への対応、CI エラーの修正、コードの変更を行う」、そして公開済みの Claude Code SDK の上に作られている、と書かれています。ページ上の操作は Install ボタン 1 つだけ。

    GitHub Apps listing for Claude published by the anthropics organisation, describing an app that runs Claude Code from pull requests and issues, with the green Install button
    このページは一読の価値あり。「CI エラーの修正」は回避策ではなく公式の用途として書かれています。1:38 の映像を見る
  2. 5

    リポジトリの範囲を絞り、権限は1行ずつ読む

    "Install & Authorize" には All repositories と Only select repositories があり、後者を選べばアカウント内の他のリポジトリを Agent から守れます。その下に GitHub が要求内容をはっきり並べます:Read access to metadata、そして Read and write access to code, issues, and pull requests。この書き込み権限があるから、後で Claude はブランチに push でき、PR を開けます。流して押すのではなく、ここは意図的に決めるべき項目です。フッターには次の遷移先として claude.ai/connect/github/callback が書かれています。

    GitHub Install and Authorize Claude screen offering All repositories or Only select repositories above the checked permissions Read access to metadata and Read and write access to code, issues, and pull requests
    Only select repositories を選べるかが、お試しと、動かしっぱなしにする本番の境目です。1:50 の映像を見る
  3. 6

    入れるワークフローにチェックを入れる

    Claude Code に戻ると "Select GitHub workflows to install - we'll create a workflow file in your repository for each one you select."。項目は 2 つで、動画ではどちらもチェック済みです。@Claude Code が作業する側で、説明は "Tag @claude in issues and PR comments"。Claude Code Review がレビューする側で、説明は "Automated code review on new PRs"。Space でトグル、Enter で確定です。

    Claude Code Select GitHub workflows to install step with both @Claude Code for tagging claude in issues and PR comments and Claude Code Review for automated code review on new PRs ticked
    この 1 画面から、作業役と検証役の 2 つのワークフローファイルが生成されます。2:10 の映像を見る
  4. 7

    Actions の実行を誰の課金で回すか決める

    人がつい素通りするのが "Choose API key" です。"Create a long-lived token with your Claude subscription" を選ぶとワークフローは Claude のサブスクリプションに紐付き、続いて出るブラウザの認可画面には「あなたのアカウントは Claude サブスクリプションの利用分として消費されます」と明記されます。"Enter a new API key" は Anthropic の API キーを使い、従量課金になります。どちらでも、認証情報は GitHub Actions の secret として保存されます——自動生成される PR の本文に、そのことが書かれています。

    Claude Code Choose API key step inside the Install GitHub App flow offering a long-lived token created with your Claude subscription or entering a new Anthropic API key
    プランの枠を使うか、都度の API 課金にするか。決めるのはこの 1 回きりです。2:16 の映像を見る

ワークフローを作る PR

/install-github-app は既定ブランチへ直接書き込みません。ワークフローファイルを載せた PR を 1 本開き、その PR の本文がこの機能のベストドキュメントになっています。

  1. 8

    セットアップの成果物はコミットではなく PR

    Claude Code はワークフローファイルを、add-claude-github-actions に長いタイムスタンプを足した新規ブランチへ書き込み、GitHub の compare 画面をプリフィルして開きます:base は main、compare はその新ブランチ、タイトルは "Add Claude Code GitHub Workflow"、本文はまるごと自動生成。自分でマージするまで、既定ブランチには何も届きません。

    GitHub Open a pull request page where the Claude Code install wrote its action files to a branch named add-claude-github-actions followed by a timestamp and pre-filled the title Add Claude Code GitHub Workflow
    自動生成されたブランチ名を見れば分かる通り、インストーラーは自分を一般コントリビューター扱いしています。2:28 の映像を見る
  2. 9

    Security の箇条書きと allowed_tools の行を必ず読む

    自動で書かれたこの本文が、この機能の一番の資料です。この PR をマージするまでは @claude への言及が効かないこと、PR や Issue のコメントで Claude に触れられるとワークフローが走ること、Claude はコメント全体と周辺コンテキスト——ファイル、diff、過去のコメントまで——を取得することが書かれています。Security には、API キーは GitHub Actions の secret として安全に保存されること、書き込み権限のあるユーザーだけがワークフローを起動できること、すべての実行は Actions の履歴に残ること、Claude の既定ツールはファイルの読み書きと、コメント・ブランチ・コミットの作成に限定されていること。そしてその下の行が広げる場所です——allowed_tools: Bash(npm install),Bash(npm run build),Bash(npm run …、この続きは画面の右の外に切れています。

    Generated Add Claude Code GitHub Workflow pull request body on GitHub showing the Security bullets about the Anthropic API key stored as a GitHub Actions secret plus the start of the allowed_tools line granting Bash npm install and npm run build
    保存すべきはこの画面。既定の境界線と、変更するときの正確な構文が両方載っています。2:42 の映像を見る
  3. 10

    レビュアーは自分の導入 PR をレビューし始める

    この PR には "claude PR Assistant workflow" と "claude Code Review workflow" の 2 つのコミットが入っています。レビュアー側のファイルがすでにツリーに入ったため、GitHub は "Some checks haven't completed yet" を表示し、claude-review (pull_request) が起動済みです——レビュアーを入れる PR 自体が、レビューの対象になっています。その下には "No conflicts with base branch"。あとはマージするかどうかだけです。

    Pull request one for the Claude Code workflow containing the claude PR Assistant workflow and claude Code Review workflow commits while the claude-review pull_request check reports it has started
    レビュアーを入れるワークフローは、自分もそのレビューに掛かる。これは不具合ではなく性質です。2:46 の映像を見る

Issue からブランチへ

引き金は @claude への言及。その後の作業はすべて GitHub 側で進み、手元のマシンは使いません。

  1. 11

    同僚に頼むのと同じ書き方で Issue を立てる

    デモのリポジトリは小さな Next.js のブログです。Issue は意図的に素っ気なく、タイトルが "Link from title missing"、本文が "There is no link from the title (in navbar) to the homepage."。ラベルもアサインも、ファイルを指す行も、直し方の示唆もありません。投げる入力はこの 1 文だけです。

    GitHub Create new issue form in the Claude Code tutorial repository titled Link from title missing with the one-line body There is no link from the title in navbar to the homepage
    プロンプトエンジニアリングは一切なし——デザイナーでも書くような普通のバグ報告です。3:34 の映像を見る
  2. 12

    @claude と書いた瞬間、Agent が拾う

    Issue を作っただけでは何も起きません。引き金はコメント 1 件、"@claude can you fix this?" です。ボットは同じスレッドに "I'll fix the missing link from the title to the homepage" と返し、5 項目の Todo List を出します——現在の navbar/header 実装の確認、タイトルから homepage へのリンク追加、実装のテスト、変更のコミットと push、PR 作成用リンクの提示。その下に実際の指摘が続きます:header の "Shinobi" タイトルはリンクのない <h1> だ、と。項目にチェックが入るたびにコメントはその場で編集され、下部の View job run が作業中の Actions ジョブへ繋がります。

    GitHub issue where an @claude can you fix this comment triggered a Claude bot reply carrying a five item Todo List and the finding that the Shinobi title is an h1 element with no link
    TODO は編集され続けるコメントなので、ジョブを開かなくても進捗が分かります。4:06 の映像を見る
  3. 13

    PR を開く直前で手を止める

    リストが終わると、ボットのコメントの頭が "Claude finished" と依頼者のハンドルに変わり、リンクが 3 つ並びます:View job、ブランチ claude/issue-3-20250815-1450、Create PR。ブランチ名に Issue 番号と日付スタンプが入っているので、同一リポジトリで複数修正を並走させても判別できます。Create PR を押すと、GitHub の作成フォームはタイトルも説明も書き終わった状態で開きます。

    Claude bot comment on a GitHub issue reading Claude finished with links to the job run, the branch claude/issue-3-20250815-1450 and a Create PR arrow
    人間が判断すべき一步は、レビューのコストが一番安いクリックの直前に置かれています。4:30 の映像を見る

レビュー、マージ、棚卸し

もう一方のワークフローが Claude の書いた diff を読んで所見を出し、Actions タブに、その一連に実際いくらかかったかが残ります。

  1. 14

    もう一方のワークフローが diff を採点する

    PR を開いた瞬間に Claude Code Review が起動します。コメントは構造化されていて、総評の後、Code Quality & Best Practices、No Bugs or Issues Found、Performance Considerations、Security の各項目に緑のチェックを付けていきます。所見は曖昧に匂わせたりせず、diff をそのまま引用します——next/link から import した Link、hover:text-accent transition-colors というクラス、href="/" が指す先、h1 がリンクの中に残っていて見出しの階層が崩れていない点まで。

    Claude Code Review feedback on pull request four grading the change across Code Quality and Best Practices, No Bugs or Issues Found, Performance Considerations and Security with green check marks
    1 つの PR にボットが 2 体。コードを書いた方と、それを読む方です。4:58 の映像を見る
  2. 15

    マージ——コミットの作者は人間のまま

    マージ欄には "Merge pull request #4 from iamshaunjp/claude/issue-3-20250815-1450" がプリフィルされ、拡張説明には PR タイトルが入り、このコミットはボットではなくリポジトリ所有者の noreply アドレスで authored されると書かれています。コードを書いたのが Claude でも、git の履歴に残るのは押した人間です。

    GitHub merge box for pull request four showing the commit message Merge pull request from the claude issue branch and a note that the merge commit will be authored by the repository owner
    git blame は人間を指します。共有リポジトリで導入する前に、ここは押さえておきたい点です。5:13 の映像を見る
  3. 16

    一連の流れは Actions タブで棚卸しする

    2 つのワークフローに計 8 本の履歴が残れば、この一連の話はそのまま読み解けます。Claude Code 側には、Issue が開かれたこと、@claude のコメント、ボット自身の返信、PR 上の後続アクションが並びます。Claude Code Review 側にはブランチ claude/issue-3-20250815-1450 に対する PR #4 のレビューが 1 分 11 秒として残ります。言及を受けただけの実行は、仕事をキューに入れるだけなので 1 秒程度で終わります。@claude が無視されたように見えるとき、見に行くべきはこのページです。

    GitHub Actions run list for the repository showing eight workflow runs across the Claude Code and Claude Code Review workflows with the review run on pull request four taking one minute eleven seconds
    実行時間だけで役割がきれいに分かります:1 秒は引き継ぎ、1 分は本気でコードを読んだ分。5:40 の映像を見る

よくある質問