Zenn
✏️

ChatGPT × GitHub Copilot を併用したら開発効率が爆上がりした話

に公開
GitHub Copilot
ChatGPT
idea

最近、Webアプリを新しく作るにあたり GitHub Copilot と ChatGPT を両方使ってみました。
結論から言うと、設計はChatGPT・実装はCopilot という役割分担をするとかなり効率が良かったので、具体例を交えて共有します。

GitHub Copilotでできること

GitHub Copilot は「AIペアプログラマー」です。
エディタ内で補完してくれるので、とにかく コードを書くスピードが上がる のが強み。

主な使い所

  • boilerplateの自動生成（Next.js, Express, Flask など）
  • CRUD処理の補完
  • フォームやUI部品の生成
  • DBクエリやモデル定義の補完
  • テストコードの雛形生成
  • 関数コメント（JSDocやdocstring）の自動生成

具体例

// Expressでユーザー一覧を返すAPIを書いて
app.get('/users', async (req, res) => {
  const users = await db.getUsers();
  res.json(users);
});

ChatGPTでできること

ChatGPTは、より広い文脈を扱える「相談役」的な存在。
設計・要件定義や、複数ファイルにまたがるレビューが得意です。

主な使い所

  • 要件定義、機能の洗い出し
  • 技術選定や構成の比較
  • フォルダ構成やアーキテクチャ設計
  • コードレビューや改善提案
  • READMEやAPI仕様書の生成

具体例

プロンプト例:

「ユーザー認証付きのタスク管理アプリを作りたい。必要な機能一覧と、Next.jsを使った場合のフォルダ構成を提案してください。」

ChatGPTは、こんなふうに「機能一覧」と「ディレクトリ構成案」を提示してくれるので、設計段階での見通しが良くなります。

ChatGPT × Copilot 併用パターン

1. 要件 → 設計 → 実装

  1. ChatGPT: 要件を整理、機能を洗い出す
  2. ChatGPT: 使用技術やフォルダ構成を提案してもらう
  3. Copilot: 実際のコード（API, UI, CRUD）をどんどん補完

👉 「頭脳はChatGPT、手はCopilot」

2. リファクタリング & 最適化

  • ChatGPT: 「この関数を読みやすく書き直して」と依頼
  • Copilot: エディタ内で提案された修正版を即補完

3. ドキュメント作成

  • ChatGPT: READMEやAPI仕様書をMarkdownで作成
  • Copilot: 関数ごとのJSDocコメントを自動で補完

4. 学習しながら開発

  • ChatGPT: 「このコードを初心者にわかりやすく解説して」と聞く
  • Copilot: 解説を踏まえて似た処理を実装

まとめ

  • ChatGPT → 戦略担当（要件定義・設計・レビュー）
  • Copilot → 戦術担当（実装補完・テスト生成・小物関数）

両者を組み合わせることで、企画から実装・テスト・ドキュメントまでAI支援で一気通貫できます。
特に個人開発や小規模プロジェクトでは「相棒が増えた」感覚でめちゃくちゃ捗ります。

おまけ：開発環境について

  • VS Code：一番メジャー、Copilotがサクサク動く
  • JetBrains IDE（IntelliJ, PyCharm など）：Java/Python系ならおすすめ
  • GitHub Codespaces：クラウドでチーム開発したいとき便利
  • Neovim：軽量派でもCopilotが使える

最後に

  • 設計で迷ったらChatGPT
  • 手を動かすときはCopilot

これを意識するだけで、開発効率がかなり変わります。
もしまだ片方しか使ってない人がいたら、ぜひ両方組み合わせてみてください！

Discussion