アイコン:メニューボタン

アイコン:TELボタン

ブログ

実践編：GitHub Copilotを使ってみた！日常開発での活用事例とコツ

この記事をSNSでシェア!

はじめに

株式会社ＫＹＯＳＯ ビジネスソリューション事業部の松井です。

「GitHub CopilotをVSCodeに導入してみた！導入背景・手順・注意点・トラブル対策まとめ」という記事にて、GitHub Copilotの導入背景やセットアップ手順、注意すべきポイント、そしてトラブル時の対処法について詳しくご紹介されています。

今回はその続編として、実際の開発現場でCopilotがどのように活躍するのか、特に「コメントからのコード生成」にフォーカスして、SAP Fiori UI5開発における具体的な活用事例とその効果的な使い方をお届けします。

GitHub Copilotを使うにあたって

GitHub Copilotは、単なるコード補完ツールではありません。開発者の意図をコメントから読み取り、必要なコードをその場で生成してくれるAIアシスタントです。特にSAP Fiori UI5のような構造が複雑で、UIとロジックが密接に連携する開発では、Copilotの力が真価を発揮します。

初学者にとっては、「何を書けばいいか分からない」という悩みを解消するヒントに。中級者にとっては「コードを繰り返し書く作業を効率化する」手段に。そしてチーム開発に携わる方にとっては「コメントベースで意図を共有し、コードの一貫性を保つ」ためのツールとして活用できます。

Copilotは、コメントを通じて開発者の思考を読み取り、その場で最適なコードを提案・生成してくれます。つまり、コメントの書き方次第で、Copilotの提案の質が大きく変わるのです。

この記事では「どう書けばCopilotが賢く動いてくれるのか」という視点から、実際のコード例を交えて、SAP Fiori UI5開発におけるCopilotの活用術を徹底解説します。Copilotを単なる補助ツールとしてではなく、開発のパートナーとして最大限に活かすためのヒントが詰まっていますので、ぜひ最後までご覧ください。

次項より、以下の観点からCopilotの活用方法を掘り下げていきます。

  • 実践事例①：コメントだけでイベントハンドラやデータ取得処理が書ける？
  • 実践事例②：ODataとの連携処理も自動生成できる？
  • 実践事例③：XMLビューの構築もコメントで指示するだけ？

実践事例①：コメントだけでイベントハンドラやデータ取得処理が書ける？

例えば、以下のようなコメントを入力すると…


ボタン押下でダイアログを表示する

Copilotは次のようにコードを提案してくれます

このように、コメントだけで実用的なコードが生成されるのは非常に便利です。もちろん、内容は調整が必要ですが、ベースとしては十分です。

実践事例②：XMLビューの構築もコメントで指示するだけ？

例えば、以下のようなコメントを入力すると…


ユーザー情報を表示するフォーム

Copilotは次のような関数を提案します

UI要素の構成やバインディングも、コメントの意図に沿って自動生成されます。

実践事例③：ODataとの連携処理も自動生成できる？

例えば、以下のようなコメントを入力すると…


ユーザー情報をODataサービスから取得する

Copilotは次のようなコードを提案します

サービス名やエンティティセットが明確であれば、さらに精度が上がります。

💡コードの妥当性について

生成されたコードの妥当性や、微調整が必要な場合はチャットにて細かく指示することで精度を上げることも可能です。

使ってみて感じたこと

Copilotを導入することで、開発業務で以下のような効果が期待されます。

  • コードレビューの補助：sap.m.Tableやsap.m.Dialogなど、Fioriガイドラインに沿ったUI部品を提案してくれるため、提案されたコードをベースに議論がしやすくなる
  • 定型処理の自動化：UI5でよく使う雛形コードを自動生成できるため、API呼び出し、バリデーション、エラーハンドリングなどが効率化される
  • コメントからのコード生成：処理の概要をコメントで書くだけで、かなり精度の高いコードが提案される
  • 初学者の学習支援：oDataバインディングの生成や、onInitなどのライフサイクルメソッドを補完ができるなど、コードの書き方や構文の理解を助ける

 SAP Fiori UI5でのCopilot活用のコツ

Copilotを使いこなすには、以下のようなポイントを意識するとより効果的です：

  1. コメントは具体的に書く
    「ODataサービスから製品一覧を取得してテーブルにバインド」など、具体的なコメントをすることでより精度の高い提案が生成されます。
  2. 提案されたコードは必ずレビューする
    Copilotの提案はあくまで「参考」。セキュリティやパフォーマンスの観点や、UI5のバージョン差やAPI仕様を誤ることもあるという観点から、必ず人間の目で確認しましょう。
  3. チームでの使い方を共有する
    「どんな場面で使うか」「どこまでをCopilotに任せるか」など、チーム内でルールを決めておくと安心です。
  4. 設定を自分に合わせて調整する
    VSCodeの設定で、Copilotの提案頻度や対象言語を調整できます。自分の開発スタイルに合わせて最適化しましょう。
  5. 繰り返し利用で精度向上
    同じプロジェクト内でUI5コードを繰り返し書くと、Copilotが文脈を学習して提案精度が高まります。
  6. ビューとコントローラを分けて書かせる
    XMLビューは「テーブルを作成」、コントローラは「onInitでODataモデルをセット」と分けて指示することで提案の精度が上がります。

まとめ

GitHub Copilotは、日常の開発において「ちょっと面倒だけど必要な処理」をサポートしてくれる頼もしい存在です。特に、定型処理の自動化や雛形生成、初学者の支援においては非常に効果的です。

ただし、AIが提案するコードには限界もあります。人間の判断とレビューを組み合わせることで、Copilotの力を最大限に活かすことができます。

2025年度のSAP TechEdでもMicrosoft Copilotとの連携について発表がありましたので、実用化に向けてみなさんの活用事例や「こんな使い方が便利だった！」というご意見をご共有いただければ幸いです。

この記事をSNSでシェア!

HOMEに戻る

この記事に関するタグ一覧