概要
Copilot の Agent モードを使った開発フローを体験するハンズオンです。
バグのある Todo Web アプリ(Flask)を題材に、以下の一連のフローを実践します。
- Copilot Agent にバグ修正を依頼する
- 自分でプロンプトを考えてバグ修正を依頼する
- PR 作成 → Copilot コードレビュー → 指摘反映
ゴール
- Copilot Agent モードの基本操作(指示 → 確認 → 承認)ができるようになる
- 状況を的確に伝えるプロンプトの書き方を身につける
- 「コード生成 → PR → レビュー → 反映」の開発フローを一通り体験する
使用技術・ツール
- Python(Flask)
- VS Code + GitHub Copilot
- devcontainer
- GitHub(PR・Copilot レビュー)
演習の流れ(35分)
| フェーズ | 時間 | 内容 |
|---|---|---|
| 事前確認 | 3分 | devcontainer 起動、テスト失敗を確認 |
| Step 1(ガイド付き) | 10分 | お手本プロンプトで Copilot Agent の操作に慣れる |
| Step 2(自力) | 12分 | 自分でプロンプトを書いてバグ修正 |
| Step 3(PR フロー) | 10分 | PR 作成 → Copilot レビュー → 指摘反映 |
そのためこのセクションでは実際に実施した演習の流れを紹介します。
演習の内容
題材は、わざとバグを仕込んだ Todo Web アプリ(Flask 製)です。環境差で詰まらないよう、開発環境は devcontainer で統一し、テストコードもあらかじめ用意した状態からスタートします。受講者は、失敗するテストを手がかりに Copilot Agent と協力してバグを直していきます。
Step 1:ガイド付きでバグ修正
まずは操作に慣れるところから。お手本のプロンプトを使って、1つ目のバグ(ファイルが存在しないときにクラッシュする不具合)を Copilot Agent に修正してもらいます。Agent がコードを編集し、ターミナルでテストを実行し、結果を確認するまでの一連の流れを体験します。ここでのポイントは、提案された差分をそのまま受け入れず、内容を確認してから承認すること。
Step 2:自力でプロンプトを書いてバグ修正
残りのバグは、プロンプトを自分で考えて修正してもらいます。テストの失敗メッセージを読み、「何が期待され、実際はどうなっているのか」を Copilot に的確に伝えられるかがカギになります。AI に丸投げするのではなく、状況を言語化して渡す力を養うのが狙いです。
Step 3:PR 作成 → Copilot レビュー → 反映
すべてのテストが通ったら、ブランチを切って Pull Request を作成します。さらに Copilot をレビュアーとしてアサインし、AI からのレビューコメントを受け取ります。指摘内容を読んで理解し、必要な修正を反映するところまでが演習のゴールです。
テストには現れないものの、コードレビューでは指摘されるべき問題(ハードコードされた秘密情報、未使用の import やデバッグ用のコードなど)をあえて仕込んでおきました。「テストが通る=完璧」ではないこと、そして AI レビューがそうした観点を拾ってくれることを体験してもらう狙いです。
まとめ
この演習を通して、Copilot Agent を使った「コードを書く → PR を出す → レビューを受ける → 反映する」という実務に近い開発サイクルを、一通り手を動かして体験してもらいました。