GitHub Copilotを使いこなす実例に学ぶAIコーディング活用術

by 74th(Atsushi Morimoto)

Slide 1

Slide 1 text

No content

Slide 2

Slide 2 text

● 所属: GO株式会社 ○ タクシーアプリ『GO』を運営 ● 職種: ○ データエンジニア・バックエンドアーキテクト ○ AIアルゴリズムを実サービスに組み込む Atsushi Morimoto (@74th) 2 ● 著書: ○ 『改訂新版 Visual Studio Code実践ガイド』技術評論社（2024年1月） ● VS Code Meetupオーガナイザ ● 趣味: 自作キーボード歴6年、電子工作

Slide 3

Slide 3 text

今日のゴール ● GitHub Copilotの具体的な活用方法がわかる ● GitHub CopilotのAgentをより有効活用する考え方を習得する 3

Slide 4

Slide 4 text

おことわり ● まだAIコーディングの世界は変容しつつあります ● VS Codeを例に説明します ● 以下は解説しません ○ 他のAIエディターとの比較 ○ LLMモデルの比較 ● 前回『GitHub Copilotの全体像と活用のヒント』との変更点 ○ Agentを使わない範囲（解説上のLevel1、2）のデモは省略 ○ より能力が上がったAgent（Level3）を中心に解説 4

Slide 5

Slide 5 text

アジェンダ 1. GitHub Copilotの概要 2. GitHub Copilotを活用するAIコーディングの3つのスタイル 3. Level 1 コーディングサポート 4. Level 2 併走エージェント 5. Level 3 自立エージェント 6. クラウドエージェント 7. エディタ上のGitHub Copilotのその他の機能 ○ ターミナル、レビュー、コミットメッセージ 8. github.com上のGitHub Copilotを使おう 5

Slide 6

Slide 6 text

1. GitHub Copilotの概要 6

Slide 7

Slide 7 text

GitHub Copilotとは 7 ● GitHub社が提供する有償のAIコーディング支援サービス

Slide 8

Slide 8 text

GitHub Copilotの特徴 8 ● エディタVS Codeの開発と密接になっており、エディタの機能と連携 ● 人とAIのコーディングの割合によって、様々な使い方ができる ● github.com 上でも機能提供 ● 複数のLLMモデルをサポート ● 組織のセキュリティガバナンスを効かせる機能が多数

Slide 9

Slide 9 text

GitHub Copilotを使うには ● GitHubアカウントが必要、GitHub上で契約 ● 無料枠の Free プラン ○ 利用可能量、利用可能モデルに制限あり ● 契約単位は、個人と、組織（Organization）の2種類 ○ 組織用のBusiness/Enterprise Planではモデルのトレーニングに入力データは利用されない 9

Slide 10

Slide 10 text

2. GitHub Copilotを活用する AIコーディングの3つのスタイル 10

Slide 11

Slide 11 text

AIコーディングの3つのスタイル 11 Coding Coding Coding Level 1 コーディングサポート Level 2 併走エージェント Level 3 独走エージェント ※　人間の関与率、AIの自律率として、Level 1~3を設定しましたが、優劣はありません

Slide 12

Slide 12 text

AIコーディングの3つのスタイル 12 Coding Coding Coding ※　人間の関与率、AIの自律率として、Level 1~3を設定しましたが、優劣はありません GitHub Copilotでは全てのスタイルが使える！ Level 1 コーディングサポート Level 2 併走エージェント Level 3 独走エージェント

Slide 13

Slide 13 text

3. Level 1 コーディングサポート: 人間のコーディングをAIが補助する 13

Slide 14

Slide 14 text

コーディングサポート 14 ● Copilotで意識されているところ ○ コーディングの集中を切らさずに、AIを支援を得られる ● 4つの機能に分けて説明 ○ コード補完 ○ 質問 Chat Askモード ○ チャットで指示 Chat Editモード ○ エラーの説明と解決

Slide 15

Slide 15 text

コード補完 15 ● 前後の文脈を読んで、続くコードを予測して補完する機能 ● 出てきた補完に対して、Tabキーで決定する ● カーソルのすぐ後ろ以外も、補完を提案する（Next Edit Suggestion）

Slide 16

Slide 16 text

コード補完のコツ 16 ● メソッド名や、コメントを説明的に記述する ● Pythonのメソッドのパラメータに型ヒントなど、絞り込むために必要な情報を渡す

Slide 17

Slide 17 text

VS Codeで使えるCopilot Chat ● チャットウィンドウ ○ 右側のペインを呼び出す ○ モードが Ask / Edit / Agent / Plan に別れている ○ 利用するLLMモデルを選択する ● インラインチャット ○ Ctrl+I/Cmd+Iを押すと、コード中にチャットウィンドウができる 17

Slide 18

Slide 18 text

Askモード ● 質問例 ○ プログラミング言語に関する質問 ■ (Pythonの) TypedDictってどういう機能？ ○ エラーに関する質問 ■ (エラーメッセージを貼り付けて) このエラーを説明して ○ ワークスペース内のコードの質問 ■ (コードを開きながら) OperationInteractorってどういう役割のクラスだと思う？ 18

Slide 19

Slide 19 text

Editモード ● チャットで指示して、コードを部分的に編集させるモード ● 指示したファイルを読んで、編集を考えて適用する 19

Slide 20

Slide 20 text

指示の例 ● 面倒なことはCopilotにやらせよう ○ (JSONの生データをエディタに貼り付けて) このJSONを格納するGoの構造体を作って。名前はUserLogだよ。 ○ (Pythonのクラスのコードを貼り付けて) Goの構造体に書き換えて 20

Slide 21

Slide 21 text

エラーの説明と解決 ● VS Codeでは、エラー表示から「修正」「説明」を指示できる 21

Slide 22

Slide 22 text

4. Level 2 併走エージェント AIに適宜指示する 22

Slide 23

Slide 23 text

AIコーディングの3つのスタイル（おさらい） 23 Coding Coding Coding Level 1 コーディングサポート Level 2 併走エージェント Level 3 独走エージェント ※　人間の関与率、AIの自律率として、Level 1~3を設定しましたが、優劣はありません

Slide 24

Slide 24 text

Agentモードを使ってみよう　デモ https://github.com/74th/event-githubcopilot-ﬁndy-2512-on-vscode/tree /main/001-agent 24

Slide 25

Slide 25 text

Agentモード 25 ● Editモード以上に様々な能力を持つ ○ ワークスペース全体のコードを検索 ○ MCP ○ ターミナル上でコマンドを実行 ○ 人間がVS Codeでできることはほとんどができる（まだデバッガによるステップ実行ができない） ● 常にAgentモードでOK ○ Agentモードであっても「今開いているファイルは何か？」というコンテキスト情報は渡される。 ○ Editモードだと、指示した周辺のみを参照するが、 Agentモードだと、ワークスペース全体を参照する

Slide 26

Slide 26 text

モデルとプレミアムリクエスト ● ベースモデル以外を利用すると、プロンプトを入れる度に、プレミアムリクエストとしてクレジットが消費される ● クレジット ○ Pro / Business: 300 ○ Pro+: 1,500 ○ Enterprise: 1,000 ● 例 ○ 無料: (Chat)GPT-5 mini (※Freeの場合x1) ○ x1: GPT-5.1-Codex、Claude Sonnet 4.5、Gemini 3 Pro ○ x10: Claude Opus 4.1 ○ x0.33: GPT-5.1-Codex-Mini、Claude Haiku 4.5 26 https://docs.github.com/en/copilot/get-started/plans-for-github-copilot https://docs.github.com/en/copilot/concepts/copilot-billing/understanding-and-managing-requests-in-copilot

Slide 27

Slide 27 text

Plan モードを使ってみよう ● Planモードとは、「情報収集」専門で、エージェントの作業方針を提案する ● 提案を審査して、良ければAgentモードに移行して、修正を実行する ● Planモード中は、対話で、さらに改良させられる ● 情報収集をさらに続けるように指示できる 27

Slide 28

Slide 28 text

Planモードを使ってみよう　デモ https://github.com/74th/event-githubcopilot-ﬁndy-2512-on-vscode/tree /main/002-agent_plan_mode 28

Slide 29

Slide 29 text

Planモード ● まだGitHub CopilotのPlanモードはこなれてない感じがする ○ あくまで小さいタスクを、さらに分解して提案する印象 ● Planを使わずに、実際に編集をやらせてみて、ダメならやり直しさせるくらいでも良い 29

Slide 30

Slide 30 text

MCP ● MCP(Model Context Protocol)とは LLMから、外部のツールやデータソースと連携するためのプロトコル ● 例 ○ GitHub MCP Server ○ Webブラウザを起動して操作できる「Playwright MCP」 ○ AWS公式MCP Server ● GitHub運営の一覧サイト MCP Registry ○ https://github.com/mcp ○ リポジトリスターの数などから、安心して利用できるMCP Serverを選定可能 30

Slide 31

Slide 31 text

Playwright MCPでブラウザ操作デモ https://github.com/74th/event-githubcopilot-ﬁndy-2512-on-vscode/tree /main/003-agent_playwright_mcp 31

Slide 32

Slide 32 text

MCP Serverの利用設定 ● MCP Registryか、拡張機能ビューで @mcp で検索して、インストール ○ 設定ファイルに追記される ● 設定ファイルに記述 ○ 個人設定: (ユーザ設定内)mcp.json ○ ワークスペース設定: .vscode/mcp.json ● 秘匿情報を管理するときにはinputsを使う 32

Slide 33

Slide 33 text

5. Level 3 独走エージェント AIに目標を達成まで独走させる 33

Slide 34

Slide 34 text

AIコーディングの3つのスタイル（おさらい） 34 Coding Coding Coding Level 1 コーディングサポート Level 2 併走エージェント Level 3 独走エージェント ※　人間の関与率、AIの自律率として、Level 1~3を設定しましたが、優劣はありません

Slide 35

Slide 35 text

● 推論と、推論結果の実行を繰り返し、ゴールに辿り着く一般論での LLMエージェント 35 ユーザプロンプトシステムプロンプト LLM 推論・ツール実行・コード修正推論結果繰り返す

Slide 36

Slide 36 text

● 情報収集と、実行を反復して行い、タスクを完了させるコーディングエージェントで考える 36 ユーザプロンプト情報収集実行・コード探索・ドキュメント参照・MCPツール実行して情報収集・Web検索・コード編集・コマンド実行・MCPツール実行 LLM 推論システムプロンプト

Slide 37

Slide 37 text

Level 2→3へ、自立性を高める 1. 利用できるツールを増やして、実行できる手を増やす ○ MCPサーバで、「ブラウザを操作してテストする」などできることを増やす 2. プロンプトで、知識を与える ○ カスタムプロンプトで、ドメイン知識や、外部リソースの知識を注入 ○ カスタムコマンドで、作業手順の知識を注入 3. 情報収集能力を伸ばす ○ MCPサーバで、外部リソースと連携する ■ GitHubのIssueなど、外部の情報ソースと連携する 37

Slide 38

Slide 38 text

単純にAgentに情報収集・実行ツールを与えれば良いか ● 情報収集・実行ツールを渡しても、”使い方を知らない”状態 ○ 例） ■ DBスキーマとなるDDLの入ったディレクトリにアクセスできるが、偶然開かないと辿り着かない ■ Makeﬁleがあり、buildというタスクが組まれているが、どういう時に使うべきか知らない（コンパイルエラーが発生するかどうかに使うべきものかなど） ● 時間をかければ、コードを読んで理解することもあるが、毎回は非効率 ● 使うべきタイミングは人間がヒントを与えた方が良い ● 「毎日、まっさらなPCを与えられた、新しいエンジニアが来る」 38

Slide 39

Slide 39 text

コードリーディングもAgentにとっては情報収集 ● 現状のAIエージェントは、ワークスペース全体のコードが頭に入った状態ではない ○ あくまで、ファイルツリーなど今ある情報からそれっぽいファイルを推測し、「1ファイルずつ開いて読む」を行う ○ この辺りは、人間と同じようなファイルの読み方をしている ○ コードのどこかにヒントがあっても見つけられないことがある ● 見つけられる、作業できる状態にする 39

Slide 40

Slide 40 text

プロンプトで知識を与える方法 ● 共通ルール（インストラクションファイル / AGENTS.md） ○ コーディングルール、コードレビュールール ○ ワークスペースのファイル構成 ○ DBなど、外部環境の情報 ○ ドメイン知識 ● 再利用可能プロンプト（プロンプトファイル / コマンド） ○ 「テストの生成」の指示と、テストの構成の情報 ○ 「テストの実行」の指示と、テストの実行コマンド ○ 情報の多い長いプロンプト 40

Slide 41

Slide 41 text

共通ルール（インストラクションファイル） ● AGENTS.md, .github/copilot-instructions.md ○ 常に参照 ○ リポジトリにコミットして、共有できる他にも… ● xxx/AGENTS.md ○ フォルダー内のファイルアクセス時に参照する ● .github/instructions/xxx.instructions.md ○ ファイルパターンを指定して、そのファイルの参照時のみ、参照する ○ リポジトリにコミットして、共有できる ● ユーザ設定内 prompts/xxx.instructions.md ○ ファイルパターンを指定して、そのファイルの参照時のみ、参照する ○ ユーザ設定として、ワークスペースをまたいで利用できる 41

Slide 42

Slide 42 text

共通ルール例 - 開発 42

Slide 43

Slide 43 text

共通ルールの生成 ● 現在のコードを解析し、インストラクションファイルを生成させることができます ● 生成されたファイルをベースに変更を加えるのも良いでしょう 43

Slide 44

Slide 44 text

再利用可能プロンプト（プロントプトファイル） ● 作ると、チャット欄で/xxxの形で呼び出せる ● LLMモデル、MCP Serverを指定できる ● .github/prompts/xxx.prompts.md ○ リポジトリにコミットして、共有できる他にも… ● ユーザ設定内 prompts/xxx.instructions.md ○ ファイルパターンを指定して、そのファイルの参照時のみ、参照する ○ ユーザ設定として、ワークスペースをまたいで利用できる 44

Slide 45

Slide 45 text

Agentへの指示方法　デモ https://github.com/74th/event-githubcopilot-ﬁndy-2512-on-vscode/tree /main/004-agent_with_context 45

Slide 46

Slide 46 text

74thのテクニック ● インストラクションファイルは分割する ○ 一度に多くの情報は読めないことを意識する ○ 「DB定義については ./db.md を参照」と書いておいて、必要時に参照させる ○ ドメイン知識全部は多いプロジェクトもあったりする。ファイル分割はドメインの概念毎にする。 46 それぞれ必要時に以下を参照 - タクシーの予約 ./reservation.md - ユーザのキャンセル ./cancel.md 例

Slide 47

Slide 47 text

74thのテクニック ● 2行以上の指示は常にプロンプトファイルに書く ○ .github/prompts/do.md をテンポラリのファイルにして毎回 /do と指示する ○ 細かく指示するのも手だが、まとめた指示の方が、再トライしやすい 47

Slide 48

Slide 48 text

74thのテクニック ● 自立性は「デバッグ」目的で使い、作業は人間が指示する ○ コードの探索能力は十分ではないことが多い ○ 編集後のコンパイルエラーや、ユニットテスト失敗を、自律的に解決するだけでも効果あり ○ 今実装に使って欲しいクラス名やファイル名を指示する ■ そうしないと、ディレクトリ構造の探索からスタートする ■ クラス名があれば、全文検索をかけて、探せる 48 タスクの管理に、楽観排他制御を導入したい todo_api/domain/entity/entity.pyのTaskに楽観排他制御用の項目を追加して todo_api/memdb/memdb.pyのMemDBがデータ管理レイヤーだから、排他制御のチェックや楽観排他の値はMemDB内で実行して例

Slide 49

Slide 49 text

74thのテクニック ● ライブラリを使うことを指示する ○ 優秀なため、ライブラリを使わずに全部実装しようとしがち ○ 「カレンダー入力にはライブラリを使って」などライブラリを使って欲しい部分を指示しよう 49

Slide 50

Slide 50 text

6. クラウドエージェント 50

Slide 51

Slide 51 text

GitHub Copilot Cloud Agent (coding agent) ● GitHub の Issue に @copilot をアサインすると、クラウド上で GitHub Copilot が起動し、コーディングと PullRequest の作成まで行う機能 ● 一気に Issue の解決まで作業し、その間には指示はできない ● PullRequest 上で、レビューコメントを残すと、再度起動して修正を試みる ● Freeでの利用は不可注） ● 公式では、“coding agent”と呼ばれていましたが、最近は”cloud agent”と呼ばれる 51

Slide 52

Slide 52 text

Cloud Agent デモ ● https://github.com/74th/event-githubcopilot-ﬁndy-2512-on-github 52

Slide 53

Slide 53 text

プレミアムリクエスト ● Cloud Agentを利用した場合、 1セッションにつき、1プレミアムリクエストを消費する ● プレミアムリクエストは個人に紐付いているため、起動したきっかけになったユーザのプレミアムリクエストを消費する ○ Issueに @copilot をアサインした人 ○ @copilot がアサインされた PullRequest に返信した人 53

Slide 54

Slide 54 text

7. エディタ上のその他の機能 54

Slide 55

Slide 55 text

コードレビュー ● コミット前に、gitにステージングしたコードをレビューをしてくれる機能 ● タイポや、一般的なセキュリティリスクのある書き方は指摘してくれる 55

Slide 56

Slide 56 text

コミットコメント ● コミットコメントを、gitの変更内容から、書いてくれる機能 ● 設定で、プロンプトを渡すこともでき、 `ﬁx: xxx` と書くように決まっている場合や、確実に日本語で書いて欲しい場合に設定すると良い。 56

Slide 57

Slide 57 text

ターミナル ● ターミナルのコマンドを、プロンプトから生成させる機能 ● ターミナルにて、Ctrl+I、Cmd+Iで呼び出す ● よく忘れるコマンドの引数などを生成してもらうと良い 57

Slide 58

Slide 58 text

JupyterNotebookの編集 ● セルを記述し、実行できます 58

Slide 59

Slide 59 text

JupyterNotebookの編集 ● グラフ化した内容もVisionで読み取り、特徴を言葉で示します 59

Slide 60

Slide 60 text

8. github.com上のGitHub Copilotの他の機能 60

Slide 61

Slide 61 text

質問 ● GitHubリポジトリに対して質問できる ○ このリポジトリの技術スタックを教えて ● IssueやPull Requestを参照して質問できる ● Pull Requestのコードについて、これはどういう修正か質問することができる 61

Slide 62

Slide 62 text

コードレビュー ● Pull Requestに @copilot をアサインすると、レビューしてくれる機能 ● 自動で、@copilotをアサインするようにもできる ● タイポや、一般的なセキュリティリスクのある書き方は指摘してくれる ● タイポなど、人間の目で確認するまでもない指摘は、Copilotにやらせよう先にレビューさせよう！ 62

Slide 63

Slide 63 text

その他 ● GitHub Copilot Spaces ○ リポジトリをまたいで情報を集約して、質問できる機能 ○ 現状、参照可能な範囲が狭く、まだ使いこなすのは難しい印象 ○ https://docs.github.com/ja/copilot/how-tos/provide-context/use-copilot -spaces/create-and-use-copilot-spaces ● GitHub Spark ○ AIに指示して、Webアプリのプロトタイプが作れるサービス ○ https://github.com/features/spark?locale=ja 63

Slide 64

Slide 64 text

さいごに 64

Slide 65

Slide 65 text

さいごに 65 ● AI Codingの世界は、まだまだ変わりつつあります ○ ツールのトレンドも、週単位で変わり続けています ○ 期待して使おうとしても、まだまだ期待したとおり動いてくれないことも多いです ● 所属会社（GO）では、Cursor、Claude Code、Geminiも活用中！ ● 実際に使ってみて、「今どのくらい使えるのか？　どう準備したら期待通りになるのか」の肌感を知っておくと、今後のAIの発展に地続きで参加できます ● 私自身も仕事のコーディングではAIに任せている割合はまだ高くはありません。 ● AIに任せられる範囲を増やして、開発生産性を上げていきましょう！