GitHub Copilot を活用した開発効率化の取り組みとその成果

メドピアには、年間（購入日が10月1日～翌年9月30日）12万円（税込）まで、開発効率やスキル向上に関わる書籍購入費やツール利用費を負担する「テックサポート制度」があります。
2023年1月頃から、一部のエンジニアがこのテックサポート制度を活用し、GitHub Copilot を導入し始めていました。

2023年3月頃には、GitHub Copilot をはじめとする生成AIサービス（ChatGPT、OpenAI API、Notion AI、Cursor など）の全社向けガイドラインが策定されました。このタイミングで、GitHub Copilot がテックサポートの対象であることが明示され、それと同時に、Copilot for Business の導入検討も始まりました。

この経緯から、2023年9月頃には GitHub Copilot の利用にテックサポートを申請する件数が一定に達したため、全社の福利厚生としてGitHub Copilot を導入するに至りました。

コミットメッセージの自動生成

VS Code 上でコミットメッセージの自動生成を行いました。
.github/instructions/commit-message.instructions.md にコミットメッセージ作成時に GitHub Copilot に参照させるコンテキストを記載しました。チーム内では従来から暗黙的にコミットメッセージに Conventional Commits を利用し、Git のコミットテンプレートの設定でコミットメッセージの記入項目を設定していました。
暗黙的なルールとなっていたコミットメッセージを明文化して GitHub Copilot にコンテキストとして参照してもらうことで、AI だけではなく人間側もコミットメッセージのルールが理解しやすくなりました。

マークダウンファイルには下記のコンテキストを記載しています。

# 提案すべきコミットメッセージ

- コミットメッセージは日本語で書く
- git log で参照した過去のコミットメッセージを参考にする
- Conventional Commits を基本とする
- 1 行目のコミットの下には空白の行間を設ける
- 複数行の詳細なコミットメッセージを書く
  - 詳細なコミットメッセージは `## 背景`、`## 修正内容` などのマークダウンの見出しをつける

このコンテキストをベースに自動生成されたコミットメッセージは自動生成の精度には課題があるため、場合によっては PR の Author が自動生成されたコミットメッセージを手直ししています。具体的にはデザインの Figma の URL や、修正の根拠となる Slack のやりとりをコミットメッセージに追記しています。 部分的に人力になっていて完璧なコミットメッセージの自動生成ができている状態ではありませんが、ゼロイチのコミットメッセージが自動生成できて、コミットメッセージのフォーマットが統一されているだけで十分な成果を得られていると考えています。

GitHub Copilot コードレビュー

PR レビューにも GitHub Copilot を活用しています。
GitHub Copilot コードレビューリリース当初は PR の description と File changed が GitHub Copilot のコンテキストとして参照されており、.github/copilot-instructions.md のコンテキストは無視されていました。
そのため、GitHub Copilot にレビューのコンテキストを教えるために .github/PULL_REQUEST_TEMPLATE.md にレビューガイドラインを記述して GitHub Copilot のレビュー精度をコントロールしていました。
しかし、2025年6月13日より GitHub Copilot コードレビューのコンテキストとして .github/copilot-instructions.md が参照されるようになったため、.github/copilot-instructions.md に下記のようなセクションを追加しています。

## コードレビューガイドライン

- レビューコメントは日本語で行う。
- レビューコメントの HTML タグはマークダウンの Code spans (`) でラップする。
- セキュリティリスクを重視してレビューしてください。
- コードの可読性を重視してレビューしてください。
- コメントや変数名、関数名などのスペルミス（typo）の指摘も行ってください。
- Vue コンポーネント命名はパスカルケース（PascalCase）で統一してください。
- JS/TS ファイル命名はキャメルケース（camelCase）で統一してください。

### 表記揺れの統一ルール

以下のような表記に統一してください：

| 不統一な表記     | 統一したい表記                                                 |
| ---------------- | -------------------------------------------------------------- |
| 全て             | すべて                                                         |
| 処方箋           | 処方せん                                                       |
| 患者様、患者さん | 患者さま                                                       |
| [普通名詞]様     | [普通名詞]さま（例：皆さま・お子さま・ご利用者さま・お客さま） |
| [患者氏名]さま   | [患者氏名]様                                                   |
| [固有名詞]       | [固有名詞]様                                                   |
| 二段階認証       | 2段階認証                                                      |
| 診療室           | 診察室                                                         |
| 来院予約         | 対面診療予約                                                   |

このコンテキストを読み込ませることで表記揺れや typo による些末なコードレビューは AI に任せることができるようになりました。
表記揺れは CI の Danger で防いでいましたが、GitHub Copilot コードレビューを導入することで CI を外すことができたのでコスト面でも恩恵が受けられています（GitHub Copilot のコストには目を瞑ります）。

GitHub Copilot Agent

こちらはまだチーム導入が進んでいませんが、GitHub Copilot Agent を使って Figma のデザインからコード生成を行うことを検討しています。
.vscode/mcp.json で Playwright MCP と Figma MCP の設定を行い、MCP を使って GitHub Copilot Agent に外部コンテンツのコンテキストを流し込んでいます。
Figma MCP でデザインデータを取得し、実際に作成されたページを Playwright MCP で表示させることで、GitHub Copilot Agent が Figma のデザインと実際の開発環境の画面を比較できるようにしています。
現時点では検証段階であり実用性はこれからですが、デザイントークンのコンテキスト整備や Storybook によるコンポーネントのコンテキスト拡充が進めば、GitHub Copilot Agent の精度も上がるのではないかと期待しています。