GitHub Copilotでバイブコーディングする方法とは？基本の流れとGitHubならではの使い方を解説

本記事では、GitHub Copilotでバイブコーディングを進める基本の流れと、GitHubならではの使い方を、開発の内製化を検討している方に向けて解説します。自社でどこまでAIに任せられるかを判断する参考にしてください。

GitHub Copilotはバイブコーディングと好相性

GitHub Copilotは、自然言語の指示からコードの生成や修正を進められるAIサービスです。GitHubは公式ドキュメントにバイブコーディングのチュートリアルまで用意しており、AIに任せながら開発する進め方を想定した機能がそろっています。

GitHub Copliotを使ったバイブコーディングのやり方は2つあります。

• VS CodeなどのエディターにGitHub Copilotを組み込み、画面を見ながら一緒に作っていく方法
• itHub上のクラウドエージェントへ作業そのものを渡す方法

なお、GitHub Copilot以外のツールとの位置づけを整理したい場合は、コーディングAIとは？仕組み・メリット・主要ツール・活用のポイントを解説もあわせてご覧ください。

GitHub Copilotでバイブコーディングする方法

GitHub Copilotを使った開発は、相談、計画、実装、確認の4段階で進みます。VS Codeの導入手順は別の記事で解説しているため、ここでは開発の流れに絞って紹介します。

• Askで作りたいものを整理する
• Planで実装手順を決める
• Agentにコードを書かせる
• 完成したものを確認して修正する

Askで作りたいものを整理する

GitHub Copliotでバイブコーディングを進めるには、いきなり実装ではなくAskで相談をしましょう。Askは質問に答えるモードのことで、コードの書き換えをせず雑談感覚でコーディングについて相談できます。

たとえば『毎日の作業時間を記録するアプリを作りたい。どんな機能が必要ですか』と聞けば、記録画面や集計機能といった候補が返ってきます。必要な機能やデータの保存方法を会話しながら決めていけるため、要件があいまいなまま実装へ進む事態を防げます。

Planで実装手順を決める

Askモードで作りたいものが固まったら、Planで実装の手順を決めましょう。Planは実装計画を提示するモードで、内容を承認するまでコードには手をつけません。

計画では以下のような情報を整理させます。

• 必要な機能
• 画面の構成
• データの保存方法
• 使用する技術
• 実装する順番

最初から完成版を目指さず、まず最低限動くところまでを1つ目の計画にすると途中で行き詰まりにくくなります。たとえば予約システムなら、まず予約を登録できるところまで作成するようなイメージで作っていきましょう。

Agentにコードを書かせる

Planモードで計画を固めたら、Agentへ実装を任せましょう。Agentはファイルの作成や複数ファイルの編集、コマンドの実行までを自分で判断しながら進めるモードです。

Askで相談してPlanで計画を作ってから渡すと、Agentが判断する場面を減らせるので、想定外のファイルを書き換えるようなリスクがありません。

実装が長くなりそうな時は、計画のうち1つ目の機能だけに区切って依頼するのもおすすめです。作業範囲を狭くしておけば確認範囲も減るので、後の工程も楽になるでしょう。

完成したものを確認して修正する

Agentの作業が終わったら、実際にアプリを動かして確認しましょう。画面が表示されるか、ボタンが動くか、入力したデータが保存されるかを、利用者の視点で試します。

万が一問題が見つかったら、症状をそのままCopilotへ伝えてください。『保存ボタンを押してもデータが残らない』のように、何をしたらどうなったかまで書くと、原因の特定が速くなります。一度に複数の修正をまとめて頼まず、1つ直すたびに動かして確かめる進め方が確実です。

GitHub Copilotで開発作業をAIに任せる方法

エディター上で一緒に作る方法とは別に、GitHub上のクラウドエージェントへ作業を丸ごと渡す使い方もあります。ここから紹介する機能は、Pro以上の有料プランで利用できます。

• Issueを作成してCopilotへ割り当てる
• Copilotが作成したPull Requestを確認する
• 必要ならCopilotへ追加修正を依頼する

Issueを作成してCopilotへ割り当てる

Issueとは、やってほしい作業を書いておく依頼票のようなもので、追加したい機能や直したい問題を登録しておけば、開発を自動で進めてくれます。

具体的には作成したIssueをCopilotへ割り当てると、クラウドエージェントが内容を読み取り、GitHub上で開発を進めます。自分のパソコンを開いていなくても作業が進むため、依頼だけ出しておいて別の仕事に戻れて便利です。

Copilotが作成したPull Requestを確認する

クラウドエージェントが作業を終えると、変更内容がPull Requestとして提出されます。Pull RequestはAIがおこなった変更を確認して、正式に取り込むかどうかを決める場所です。

ここでどのファイルが変わり、何が追加され、何が削除されたのかを確認します。確認せずに取り込むと意図しない変更まで本体へ入ってしまうため、必ず目を通してから反映してください。コードをすべて理解できなくても、変更されたファイルの範囲だけは見ておきましょう。

必要ならCopilotへ追加修正を依頼する

Pull Requestを見て気になる点があれば、そのままCopilotへ追加の修正を依頼しましょう。コメントで指摘すると、クラウドエージェントが続きの作業を進めます。

簡単に言うと依頼、実装、確認、再修正という往復を、GitHub上で完結できる形です。人のメンバーへレビューを返すときと同じ感覚で指摘できるため、特別な操作はなく、指摘するだけで修正版が自動で出力されます。

GitHub Copilotへ開発ルールを覚えさせる方法

GitHub Copliotに毎回プロンプトを渡し続けるよりも、プロジェクト共通のルールをファイルにまとめておいたほうが効率的に作業できます。ここでは、設定する場所と書き方のコツを紹介します。

• copilot-instructions.mdにプロジェクトのルールを書く
• ルールは短く具体的に書く

copilot-instructions.mdにプロジェクトのルールを書く

プロジェクト共通の指示は、.github/copilot-instructions.mdというファイルに書いておきましょう。リポジトリに置いておくと、Copilotが指示を受けるたびにその内容を参照します。

書いておくと役に立つのは、次のような内容です。

• 使用する技術やライブラリ
• ファイルの構成
• 名前の付け方
• テストの書き方
• 変更してほしくない部分

とくに変更してほしくない部分を書いておくと、関係のないファイルまで書き換えられる事故を減らせます。

ルールは短く具体的に書く

開発ルールは、短く具体的に書きましょう。長い文章で方針を語るより、守ってほしい条件を箇条書きで並べたほうが確実に効きます。

たとえば『きれいなコードを書いてください』では基準が伝わりませんが、『関数は1つにつき50行以内』『変数名は英語の小文字とアンダースコアで書く』なら判断できます。ルールを増やしすぎると全体がぼやけるため、まずは守ってほしい項目を5つほどに絞って始めてみてください。

GitHub Copilotで作ったコードを確認する方法

バイブコーディングでは、AIに作らせるだけでなく、変更の中身を確かめる工程も必要です。GitHubの機能を使った確認方法を2つ紹介します。

• Pull Requestで変更内容を確認する
• Copilot コード レビューを利用する

Pull Requestで変更内容を確認する

GitHub Copilotで作ったコードを確認するには、Pull Requestの画面で、変更の中身を確認しましょう。追加された行と削除された行が色分けで表示されるため、どこがどう変わったのかを目で追えます。

コードを1行ずつ理解する必要はないので、変更されたファイルの数と名前、そして自分が依頼していない箇所が触られていないかだけは、毎回見ておきましょう。依頼した内容と関係のないファイルが並んでいたら、その時点で取り込みを止めて理由を聞いてください。

Copilot コード レビューを利用する

コード確認を目視でするのが不安な場合は、Copilot コード レビューを使いましょう。Pull Requestの変更内容をCopilotが読み、問題点や改善案をコメントで指摘してくれます。

ただし、AIが書いたコードをAIがレビューしたからといって、品質が保証されるわけではありません。

指摘を受け取ったうえで、実際に動かして確かめる作業は残しておきましょう。

GitHub Copilotでバイブコーディングを効率化するポイント

GitHub Copilotでバイブコーディングを効率化するためには、ここまで紹介した機能を場面に応じて使い分ける必要があります。押さえておきたい3つのポイントを整理しました。

• VS CodeのAgentとクラウドエージェントを使い分ける
• Issueは一つの作業に絞る
• 正常に動いた状態をGitに残す

VS CodeのAgentとクラウドエージェントを使い分ける

VS CodeのAgentとクラウドエージェントは、画面を見ながら作るかどうかで使い分けをするのがおすすめです。デザインを調整しながら進める作業、動かして確かめながら直す作業はエディター上のAgentが向いています。

一方で、やることがはっきりしている機能の追加、バグの修正はクラウドエージェントへ渡すほうが効率的です。依頼したあとは承認作業などが発生しないため、その間に別の作業を進められます。

迷った場合は途中で確認が必要なのかどうかで判断しましょう。

Issueは一つの作業に絞る

クラウドエージェントへ渡すIssueは、1つの作業に絞りましょう。複数の機能をまとめて書くとどこまで作業が終わったのかが追えなくなり、Pull Requestの確認も重くなります。

たとえば予約システムなら、予約の登録、一覧の表示、キャンセル、通知はそれぞれ別のIssueにするのが基本です。作業が小さいほど、問題が起きたときにどのIssueが原因かを特定しやすくなります。

正常に動いた状態をGitに残す

アプリが正常に動いたら、その状態をGitに記録しておきましょう。AIは短時間で大量のコードを書き換えるため、戻れる地点を作っておかないと、壊れたときに復旧できなくなります。

クラウドエージェントを使っている場合は、Pull Requestを取り込む単位で履歴が残るため、意識しなくても記録がそろいます。エディター上のAgentで作業した場合は自分でコミットする必要があるので、機能が1つ動いたタイミングを目安にしてください。

まとめ

GitHub Copilotでは、エディター上でAsk・Plan・Agentを切り替えながら開発を進められます。相談してから計画を作り、実装を任せて確認するという流れを覚えれば、バイブコーディングの基本は押さえられます。

さらにGitHub Copilotの場合、GitHub上のクラウドエージェントへ作業そのものを渡せる点が特徴です。Issueで依頼し、Pull Requestで結果を確認し、必要なら追加で直してもらう。copilot-instructions.mdにルールを書いておけば、毎回同じ条件を伝える手間も省けます。

一方で、AIが書いたコードを人が確認する工程は残ります。顧客が使うサービスや個人情報を扱うシステムでは、設計やテスト、セキュリティ、その後の保守まで考える必要があるため、専門家と組む選択肢も検討してみてください。弊社では、要件の整理から開発、運用までを一貫してご支援しています。

AIソリューションを用いたシステム開発などのご相談にも乗れますので、ぜひ一度ご連絡ください。

お問い合わせ｜xTECHソリューション｜ブライセン