VS CodeでGitHub Copilotを使う方法｜AIペアプログラマーでコーディング効率アップ！

プログラミング・IT

「もっと速くコードを書きたい」
「面倒な処理をAIに補完してほしい」
そんな開発者の夢を叶えてくれるのが GitHub Copilot です。

VS CodeでGitHub Copilotを使えば、AIがコードを提案・自動生成してくれるので、実装スピードが飛躍的に上がります。

この記事では、GitHub CopilotをVS Codeで使う方法から便利な使い方・コツまで、わかりやすく解説します。

スポンサーリンク

GitHub Copilotとは？

Screenshot

GitHub Copilotは、GitHubとOpenAI（ChatGPTを作った会社）が共同開発した AIコード補完ツール です。

何ができる？

  • コメントからコード生成: 自然言語で書いた説明をコードに変換
  • リアルタイム補完: 次に続く処理を自動で予測し補完
  • 多言語対応: Python、JavaScript、TypeScript、Go、Rubyなど多数の言語に対応
  • テストコード生成: テストケースやダミーデータの自動生成
  • コード修正提案: バグ修正やリファクタリングの提案

具体例

コメントを書くだけで、関数が自動生成されます：

# 2つの数値を足す関数
def add_numbers(a, b):
    return a + b

料金体系

  • 個人向け: 月額10ドル（年額100ドル）
  • 企業向け: 月額19ドル/ユーザー
  • 学生・OSS開発者: 無料
  • 30日間無料トライアルあり

VS CodeでGitHub Copilotを使う方法

前提条件

  • VS Code: 最新版を推奨
  • GitHubアカウント: 無料アカウントでOK
  • インターネット接続: AI機能のためオンライン必須

Copilot拡張をインストール

手順1: 拡張機能の検索

  1. VS Code左の拡張機能アイコン（四角いマーク）をクリック
  2. 検索欄で「copilot」と検索
  3. GitHub Copilot（github.copilot） を見つける

手順2: インストール実行

「インストール」ボタンをクリックし、拡張機能をインストールします。

手順3: 追加拡張の検討

あわせて以下もインストールすると便利です：

  • GitHub Copilot Chat: チャット形式でCopilotと対話
  • GitHub Copilot Labs: 実験的機能を試せる

GitHubアカウントでログイン

サインインの手順

  1. インストール後、VS Code画面右下に「GitHubでサインイン」通知が表示
  2. 通知をクリックするとブラウザが開く
  3. GitHubアカウントでログイン
  4. VS Codeへのアクセスを許可

認証の確認方法

VS Codeのステータスバー（右下）にCopilotのアイコンが表示されれば成功です。

基本的な使い方

自動補完の受け入れ

  • Tab: 提案をそのまま受け入れる
  • Esc: 提案をスキップ
  • Ctrl + Enter: 複数の提案を表示（Copilot Panelを開く）

複数候補の切り替え

  • Alt + [: 前の候補
  • Alt + ]: 次の候補
  • Macの場合: Option + [ Option + ]

手動での提案要求

  • Alt + \: 手動で提案をリクエスト
  • Ctrl + Shift + P: コマンドパレットから「GitHub Copilot」関連のコマンドを実行

Copilotを効果的に活用するコツ

コメントドリブン開発

処理の説明を自然言語でコメントに書くと、Copilotがそのコメントを理解してコードを提案してくれます。

良いコメントの書き方

// ユーザーIDからユーザー情報を取得するAPIを呼び、エラーハンドリングも行う
async function fetchUser(userId) {
    try {
        const response = await fetch(`/api/users/${userId}`);
        if (!response.ok) {
            throw new Error('User not found');
        }
        return await response.json();
    } catch (error) {
        console.error('Error fetching user:', error);
        return null;
    }
}

より具体的なコメント例

# CSVファイルを読み込んで、年齢が30歳以上のユーザーのみを抽出し、新しいCSVとして保存する
import pandas as pd

def filter_users_by_age(input_file, output_file, min_age=30):
    df = pd.read_csv(input_file)
    filtered_df = df[df['age'] >= min_age]
    filtered_df.to_csv(output_file, index=False)
    return len(filtered_df)

関数名と変数名を工夫する

Copilotは関数名や変数名からも処理内容を推測します。

分かりやすい命名例

# 良い例：関数名から処理が推測しやすい
def calculate_tax_amount(price, tax_rate):
    return price * tax_rate

def send_welcome_email(user_email, user_name):
    # Copilotがメール送信のコードを提案

テストコードの自動生成

ユニットテストの生成

def add(a, b):
    return a + b

# add関数のユニットテストを書く
import unittest

class TestAddFunction(unittest.TestCase):
    def test_add_positive_numbers(self):
        self.assertEqual(add(2, 3), 5)
    
    def test_add_negative_numbers(self):
        self.assertEqual(add(-1, -1), -2)
    
    def test_add_zero(self):
        self.assertEqual(add(0, 5), 5)

エラーケースのテスト

# エラーハンドリングのテストケースを作成
def test_divide_by_zero(self):
    with self.assertRaises(ZeroDivisionError):
        divide(10, 0)

データ構造の生成

サンプルデータの作成

// ユーザー情報のサンプルデータを10件作成
const sampleUsers = [
    { id: 1, name: "田中太郎", email: "tanaka@example.com", age: 28 },
    { id: 2, name: "佐藤花子", email: "sato@example.com", age: 32 },
    // ... Copilotが残りのデータを自動生成
];

言語別の活用例

Python開発での活用

データ分析コード

# 売上データを月別に集計してグラフを作成
import pandas as pd
import matplotlib.pyplot as plt

def create_monthly_sales_chart(sales_data):
    monthly_sales = sales_data.groupby('month')['amount'].sum()
    
    plt.figure(figsize=(10, 6))
    monthly_sales.plot(kind='bar')
    plt.title('月別売上推移')
    plt.xlabel('月')
    plt.ylabel('売上金額')
    plt.xticks(rotation=45)
    plt.tight_layout()
    plt.show()

API開発

# FastAPIでユーザー管理のエンドポイントを作成
from fastapi import FastAPI, HTTPException
from pydantic import BaseModel

app = FastAPI()

class User(BaseModel):
    name: str
    email: str
    age: int

@app.post("/users/")
async def create_user(user: User):
    # ユーザー作成処理
    return {"message": "User created successfully", "user": user}

JavaScript/TypeScript開発での活用

React コンポーネント

// ユーザー一覧を表示するReactコンポーネント
import React, { useState, useEffect } from 'react';

interface User {
    id: number;
    name: string;
    email: string;
}

const UserList: React.FC = () => {
    const [users, setUsers] = useState<User[]>([]);
    const [loading, setLoading] = useState(true);

    useEffect(() => {
        fetchUsers();
    }, []);

    const fetchUsers = async () => {
        try {
            const response = await fetch('/api/users');
            const data = await response.json();
            setUsers(data);
        } catch (error) {
            console.error('Error fetching users:', error);
        } finally {
            setLoading(false);
        }
    };

    if (loading) return <div>Loading...</div>;

    return (
        <div>
            <h2>ユーザー一覧</h2>
            {users.map(user => (
                <div key={user.id}>
                    <h3>{user.name}</h3>
                    <p>{user.email}</p>
                </div>
            ))}
        </div>
    );
};

Copilot Chatの活用

チャット機能の使い方

基本的な質問

Q: この関数のバグを見つけて修正してください
Q: このコードをより効率的にリファクタリングできますか？
Q: TypeScriptの型定義を追加してください

コード説明の要求

Q: この正規表現の意味を説明してください
Q: このアルゴリズムの時間計算量を教えてください

実践的なチャット例

Q: Pythonでファイルを暗号化する方法を教えてください

A: 以下は`cryptography`ライブラリを使った例です：

```python
from cryptography.fernet import Fernet

def encrypt_file(file_path, key):
    fernet = Fernet(key)
    with open(file_path, 'rb') as file:
        file_data = file.read()
    encrypted_data = fernet.encrypt(file_data)
    
    with open(file_path + '.encrypted', 'wb') as file:
        file.write(encrypted_data)

よくある問題と対処法

Copilotが提案を出してくれない

原因と対策

  1. ネットワーク接続: インターネット接続を確認
  2. ログイン状態: GitHubに正しくログインしているか確認
  3. ファイル形式: サポートされている言語ファイルか確認
  4. コメント品質: より具体的で明確なコメントを書く

提案の品質が低い

改善方法

  • コンテキスト情報: ファイルの上部にプロジェクトの説明を書く
  • 型情報: TypeScriptやPythonの型アノテーションを使用
  • 関数名: より説明的な関数名を使用

セキュリティ面での注意

避けるべきこと

  • 機密情報: パスワードやAPIキーを含むコードでの使用
  • 個人情報: 実際の顧客データを含むコード例
  • 企業秘密: 機密のアルゴリズムやビジネスロジック

推奨する使い方

  • 学習用コード: サンプルコードやプロトタイプ
  • 一般的なパターン: よく知られたデザインパターンの実装
  • テストコード: ダミーデータを使ったテスト

パフォーマンス最適化

Copilotを高速化する方法

VS Code設定の調整

{
  "github.copilot.enable": {
    "*": true,
    "yaml": false,
    "plaintext": false
  },
  "github.copilot.advanced": {
    "length": 500,
    "temperature": 0.5
  }
}

不要な拡張機能の無効化

リソースを節約するため、使わない拡張機能は無効にしましょう。

よくある質問

Q: Copilotの提案をそのまま使っても著作権的に問題ないですか？

A: GitHubは法的責任を負うとしていますが、重要なプロジェクトでは提案されたコードを確認し、必要に応じて修正することをおすすめします。

Q: オフラインでも使えますか？

A: Copilotはクラウドベースのサービスのため、インターネット接続が必要です。オフライン環境では動作しません。

Q: 会社のコードが学習データに使われませんか？

A: GitHub Copilot for Businessでは、企業のコードは学習に使用されません。個人版では一定の制限があります。

Q: どの程度の精度で動作しますか？

A: 簡単な処理は90%以上の精度ですが、複雑なビジネスロジックは人間の確認が必要です。補完ツールとして活用することが重要です。

まとめ

VS CodeでGitHub Copilotを使うことで、以下のメリットが得られます：

  • 開発速度の向上: コメントや変数名からAIが次のコードを提案
  • 学習効率アップ: 新しい技術やパターンを学習しながら実装
  • テスト作成の簡素化: ユニットテストやダミーデータを簡単に生成
  • リファクタリング支援: より良いコード構造の提案
  • 多言語対応: 様々なプログラミング言語で活用可能

Youtube

神話・歴史・伝承の解説チャンネル

スポンサーリンク

コメント

タイトルとURLをコピーしました