GitHub Copilot, GitHub Copilot Chat でポーカーを作成してみる

4.1K Views

November 29, 23

スライド概要

賢い IntelliSense として、GitHub Copilot, GitHub Copilot Chat でポーカーを作成してみたレポートです

profile-image

SIerの人。Xamarin.iOS が好き。Azure と戯れるのが仕事。Visual Studio for Mac が Win版と同等になる日を切望。Microsoft MVP Developer Technologies 2017-

シェア

またはPlayer版

埋め込む »CMSなどでJSが使えない場合

関連スライド

各ページのテキスト
1.

GitHub Copilot, GitHub Copilot Chat でポーカーを作成してみる Tomohiro Suzuki @hiro128_777 2023-11-30 C# Tokyo

2.

自己紹介 鈴木友宏 M365、Azure、Power Platform、.NET などの Microsoft 製品を用いたシステムの構築をしています。 Twitter:@hiro128_777 blog:https://hiro128.hatenablog.jp/ 2

3.

アジェンダ ① GitHub Copilot, GitHub Copilot Chat でポーカーをつくってみたレポート ② まとめ 3

4.

本日のゴール ① 賢い IntelliSense として、GitHub Copilot, GitHub Copilot Chat を利 用した開発のイメージを掴む ② より良い提案を得るためのヒントを得る • Copilot, Copilot Chat の使い分けを含む、全体的な進め方 • プロンプトの文面 4

5.

前提条件 5

6.

ご注意 ① この資料では、賢い IntelliSense として、GitHub Copilot, GitHub Copilot Chat を利用しています。(ほかの使い方もあります) ② GitHub Copilot, GitHub Copilot Chat に限らず AI はあえてブレが出るように なっているので、この資料と同じプロンプトを投入しても必ずしも同じ結果になる とは限りません ③ 手作業の修正は最小限とし、なるべく提案されたコードをそのまま使うようにし ており、コード自体のベストプラクティスにはこだわっていません。 ④ Copilot, Copilot Chat の使い分けは一例であって、唯一の正解ではありませ ん。 6

7.

準備作業、アプリの要件 7

8.

Visual Studio の拡張機能を確認 以下の3つがインストールされてなければインストールする 8

9.

ソリューションとプロジェクトの構成 コンソールアプリ(.NET8) xUnit テスト 今回テストまでは話せないので、 無くてもよいです。 9

10.

アプリの要件 • • • • 最低限度の機能を持ったポーカーのコンソールアプリ カードの交換は1回 想定手順は、手札配布→保持するカードの選択→カード交換→役の判定 例外のハンドリングはしない ポーカーを題材にした理由 well-known な題材のため、GitHub Copilot 側の学習量に依存せず、純粋に Copilot, Copilot Chat の挙動を確認できると予想した。 10

11.

ここから、アプリ作成 1

12.

トランプのカードのクラスを作成 1

13.

トランプのカードのクラスを作成 クラス定義だけ提案された 1

14.

トランプのカードのクラスを作成 期待通りでなければ、詳細を再入力 14

15.

アメリカを再び強くするっっっ! ???これは….www プロンプトがよくなかった…. 15

16.

トランプのカードのクラスを作成 気を取り直して、解像度が高いプロンプトを投入 ただし、プロンプトの解像度を高めるには、開発経験がないと難しい 16

17.

トランプのカードのクラスを作成 今度はいい感じ!! 大〇領ではなく トランプのカードが実装されていそう Card.cs が 生成されている 17

18.

ポイント① プロンプトは Copilot が誤解しないように 解像度高く記述する 1

19.

トランプのカードのクラスを作成 いったん、Card クラスはここまでにして次に進む 19

20.

Dealer のクラスを作成 先ほどの教訓を生かし、実装するメソッドの仕様も含めるなど解像度高く書いてみる 20

21.

Dealer のクラスを作成 指示通りのクラスとメソッドが実装されている。 Visual Studio の不具合なのか提案されたコードの全体が 見れないので、いったん承諾して、詳しく実装を見てみる Dealer.cs が 生成されている 21

22.

Dealer のクラスを作成 エラーがある。enum Suit が参照できていない。 22

23.

Dealer のクラスを作成 この程度のエラーであれば、 手動で enum のスコープを 変更した方が早い エラーが消えた 手作業はちょいちょい必要になる 23

24.

ポイント② 細かい修正は手動も組み合わせるとよい 2

25.

Dealer のクラスを作成 カードの数字のプロパティが異なっている。 • Dealer では enum Rank • Card では int 25

26.

Dealer のクラスを作成 当該の箇所を削除し Enter で Copilot に提案させてみる Card の実装を参照して、 適切なコードを提案してくる 26

27.

Player のクラスを作成 27

28.

Player のクラスを作成 いい感じのようだ Visual Studio の不具合なのか全体が見れないので いったん承諾して、詳しく実装を見てみる Player.cs が 生成されている 28

29.

Player のクラスを作成 メソッド名に齟齬がありエラーが出ているので、手作業で修正する。 Player Dealer エラー エラーが消えた 29

30.

Card のクラスの ToString() を修正 試しに、人間に寄せた表現にしてみたが、 文脈を汲んで適切な提案をしてきた 30

31.

Player のクラスの ShowHand() を修正 気にいらなければ別の実装も選べる 31

32.

役判定のクラスを作成 Copilot Chat だとロジックが実装 されていない提案しかされない こういう場合、いったん承諾して、 Copilot に提案させる 32

33.

役判定のクラスを作成 実装を削除し、コメントも書かず、 Enter で Copilot に提案させてみる よさげな実装が提案されたが… 33

34.

役判定のクラスを作成 途中で切れている 切れているメソッドの実装を削除して再度 Enter で提案させる これ以降が切れている (チャンクの制限と思われる) 34

35.

役判定のクラスを作成 Ctrl + Alt + Enter で全ての提案を確認すると、未実装のメソッドを含め、 続きが提案された。もし、また途中で切れているので何度か繰り返す 35

36.

役判定のクラスを作成 細かいエラーは Copilot にやらせるのも面倒なので手動で修正。 public にする public にする 36

37.

Program.cs を実装する ここからが Copilot の本領発揮! ある程度実装が進んで、判断 材料がそろえば、Enter だけで、 コメントも実装も提案される 37

38.

Program.cs を実装する 文脈が揃ってくると、Enterだけで、コメント、実装がどんどん進む 38

39.

Program.cs を実装する ちょいちょい間違えるので、そこは手作業で修正 コンストラクタのパラメーターはないので手作業で削除 39

40.

Program.cs を実装する 40

41.

Program.cs を実装する 初期配布された手札を標示するところまで進ん だので、いったんデバッグ実行してみる 41

42.

Program.cs を実装する デバッグ実行すると文字化けしている →Suit が「?」になる 文字コードの問題なので修正する トラブルシューティングも提案された! 文字化けしなくなった 42

43.

ポイント③ 簡単なトラブルシューティングなら 発生現象と期待値を投入すれば提案される 4

44.

Player クラスに Hold() を実装する 44

45.

Player クラスに Hold() を実装する 45

46.

Card クラスに IsHeld プロパティを実装 46

47.

Program.cs を実装する 47

48.

Dealer にカードをチェンジするメソッドを実装 48

49.

Player に Hand を実装 既存の hand フィールドと衝突して、いい感じに修 正できないので手作業で修正 49

50.

Player に Hand を実装 プロパティを修正すれば、残りは提案してくれる 50

51.

Player に Hand を実装 51

52.

Player に HandType を実装 52

53.

完成 ※テストをしていないので、バグがあるかもしれません。 テストも Copilot で実装できますが、長くなったのでそれはまたの機会に。 53

54.

まとめ ① 現時点で実用性は十分 ② well-known な領域には圧倒的に強く、ニッチな領域は弱めなので、基盤領域は Copilot に任せプロダクトの価値へ直接 寄与する独自ロジックにリソースを集中できる ③ (Copilot が文脈を理解するためのパラメーターとなる)コード量が少ない開発の初期段階では Copilot Chat を利用した 方が、意図通りのコードが提案されやすく、実装が進むにつれてパラメーターが増えるので Copilot の提案の精度が向上す る。 ④ Copilot に文脈を理解させるためにエンティティ→ロジックの順で実装するのがおすすめ ⑤ プロンプトの解像度によって提案の精度が大きく変わるため、(特に開発の初期段階では)ある程度提案してほしいコー ドを想定したプロンプトを投入する必要がある ⑥ 簡単なトラブルシューティングなら発生現象と期待値を投入すれば提案される ⑦ 納得のいく提案が出ない場合、Copilot Chat, と Copilot を切り替えて試すとよい提案を引き出せる可能性が高い ⑧ 英語に強いので命名で悩んだ時の参考には非常に役立つ ⑨ コード全体を俯瞰してエキスパートの開発者が満足できるレベルでの一貫性のあるコードの提案はできない。たとえば、for or foreach, LINQ に寄せる、その他細かい書きっぷりにまでこだわりたいなら細かくプロンプトで指示するか、ある程度手動で 修正が必要(たぶん将来的に精度は上がって解決する) 54

55.

ご清聴ありがとうございました