Slide 1

Slide 1 text

ChatGPT触ってみた
 ~質問からテストコードまで~
 株式会社インフィニットループ 西竜太郎


Slide 2

Slide 2 text

自己紹介
 2

Slide 3

Slide 3 text

自己紹介
 - 西 竜太郎
 - エンジニア歴は10年ぐらい
 - インフィニットループ歴は7年目です
 - 会社ではソーシャルゲームのサーバサイドの開発をしてお ります
 - ゼルダおもしろい
 3

Slide 4

Slide 4 text

今日話す内容は個人の見解です
 ILではChatGPTの使用は禁止です
 4

Slide 5

Slide 5 text

突然ですが、みなさん
 開発って難しいですよね
 5

Slide 6

Slide 6 text

開発って難しいですよね
 - コード書くの難しい
 - ググっても、情報が多すぎてよくわからない
 - テストコード書くの工数かかる
 6

Slide 7

Slide 7 text

ChatGPT使おうぜ
 7

Slide 8

Slide 8 text

今日は3つのことをお話します
 1. ChatGPTってなに?
 2. 質問について
 3. テストコードの生成
 8

Slide 9

Slide 9 text

ChatGPTってなに?
 9

Slide 10

Slide 10 text

ChatGPTってなに?
 - AIの専門家ではないので、これからお話する内容が間違っ ていた場合はすいません
 - ChatGPTに関する論文は公表されていないので、技術的な 部分は推測に依存する部分があります
 10

Slide 11

Slide 11 text

ChatGPTってなに?
 OpenAI社が開発した、質問に対して文章を作るAI
 
 Chat Generative Pre-trained Transformer
 事前学習済みのチャット生成変換器
 11

Slide 12

Slide 12 text

ChatGPTってなに?
 ~事前学習~
 12

Slide 13

Slide 13 text

ChatGPTってなに?~事前学習~
 - 2021年までの大量のデータを事前に勉強させている
 - 2022/2023年のことは答えられない
 13

Slide 14

Slide 14 text

ChatGPTってなに?~事前学習~
 事前学習方法は次単語予測というのを使っているらしいです
 
 「吾輩」 -> 「は」 -> 「A」 -> 「B」 -> 「C」
 14

Slide 15

Slide 15 text

ChatGPTってなに?~事前学習~
 「吾輩」 -> 「は」 -> 「A」 -> 「B」 -> 「C」
 
 「吾輩」「は」のあとには「猫」が来る確率が一番高い!
 なのでAには「猫」を入れる
 それをB、Cと数珠つなぎに続けていく
 15

Slide 16

Slide 16 text

ChatGPTってなに?~事前学習~
 つまり、ChatGPTは手前の単語から、次に来る確率が一番高い 単語を生成している
 そのことを頭に入れておくと、自分の欲しい答えが生成されや すい
 16

Slide 17

Slide 17 text

ChatGPTってなに?
 ~バージョン~
 17

Slide 18

Slide 18 text

ChatGPTってなに?~バージョン~
 有料版はバージョン4です(月額20ドル)
 無料版はバージョン3.5です
 今回資料作成にあたって使用したバージョンは3.5です
 無料版でも問題なく利用できますので、ぜひみなさん触ってみ てください
 18

Slide 19

Slide 19 text

ChatGPTってなに?
 ~Microsoft~
 19

Slide 20

Slide 20 text

ChatGPTってなに?~Microsoft~
 - Microsoft社がOpenAI社に1兆3,000億円の投資
 - ChatGPTはこれからどんどん進化していく
 - 乗るしかないこのビッグウェーブに
 20

Slide 21

Slide 21 text

ChatGPTってなに?
 ~まとめ~
 21

Slide 22

Slide 22 text

ChatGPTってなに?~まとめ~
 - OpenAI社が開発した文章生成AI
 - ChatGPTは手前の単語から次の単語を予測している
 - 無料バージョンは3.5、有料バージョンは4
 - Microsoft社が大量のお金を投資しているので、将来的にも 期待できる
 22

Slide 23

Slide 23 text

ChatGPTってなに?
 以上です
 23

Slide 24

Slide 24 text

質問について
 24

Slide 25

Slide 25 text

今日は3つのことをお話します
 1. ChatGPTってなに?
 2. 質問について <- 今ここ
 3. テストコードの生成
 25

Slide 26

Slide 26 text

質問について
 ~入力のコツ~
 26

Slide 27

Slide 27 text

質問について~入力のコツ~
 ガベージイン、ガベージアウト
 ゴミを入れたらゴミが出てくる
 質問方法にもコツがある
 27

Slide 28

Slide 28 text

質問について~入力のコツ~
 入力のコツは主に3つ
 1. 制限を与える
 2. 前提を与える
 3. 役割を与える
 28

Slide 29

Slide 29 text

質問について
 ~制限を与える~
 29

Slide 30

Slide 30 text

質問について~制限を与える~
 目的
 - 非IT技術者/学生/お年寄りなどIT分野に興味がないけど、 スティーブ・ジョブズの人生を簡単に知りたい
 - wikipediaは情報が多すぎて読む気が起きない
 30

Slide 31

Slide 31 text

31

Slide 32

Slide 32 text

質問について~制限を与える~
 アンチパターン
 32

Slide 33

Slide 33 text

33

Slide 34

Slide 34 text

質問について~制限を与える~
 - 読むのに時間もかかる
 - 一回じゃ表示されずに「つづき」と入力する作業が発生
 - wikipediaよりはまとまってるけど、それでも情報量が多い
 - 書いてあることが難しい
 34

Slide 35

Slide 35 text

質問について~制限を与える~
 解決策
 制限を与える
 - 100文字以内にまとめてください
 - 3回にわけて教えてください
 - 小学生にもわかるように
 35

Slide 36

Slide 36 text

36

Slide 37

Slide 37 text

質問について~制限を与える~
 流石に簡単すぎた
 - 「社会人にわかるよう」に変更
 - もう少し読めそうなので200文字に変更する
 37

Slide 38

Slide 38 text

38

Slide 39

Slide 39 text

39

Slide 40

Slide 40 text

40

Slide 41

Slide 41 text

質問について~制限を与える~
 問題解決!
 - もっと深く内容を知りたいときは文字数を上げていくなど工 夫する
 41

Slide 42

Slide 42 text

質問について
 ~前提を与える~
 42

Slide 43

Slide 43 text

質問について~入力のコツ~
 入力のコツは主に3つ
 1. 制限を与える
 2. 前提を与える <- 今ここ
 3. 役割を与える
 43

Slide 44

Slide 44 text

質問について~前提を与える~
 目的
 - 花火に興味があり、将来花火師になりたいかもしれない
 - 花火の作り方を知りたい
 44

Slide 45

Slide 45 text

質問について~前提を与える~
 アンチパターン
 45

Slide 46

Slide 46 text

46

Slide 47

Slide 47 text

質問について~前提を与える~
 - ネットでググれば出てくる情報ですが、安全上の理由でたま に表示されないときがある
 47

Slide 48

Slide 48 text

質問について~前提を与える~
 解決策
 前提を与える
 - 「私は〇〇です」という前提を与える
 - 今回は「花火師を目指している高校生」という前提を与える
 48

Slide 49

Slide 49 text

49

Slide 50

Slide 50 text

50

Slide 51

Slide 51 text

質問について~前提を与える~
 問題解決!
 - 前提を与えるとより欲しい文章が生成される
 51

Slide 52

Slide 52 text

質問について
 ~役割を与える~
 52

Slide 53

Slide 53 text

質問について~入力のコツ~
 入力のコツは主に3つ
 1. 制限を与える
 2. 前提を与える
 3. 役割を与える <- 今ここ
 53

Slide 54

Slide 54 text

質問について~役割を与える~
 目的
 - awsでインフラを構築することになったけど、注意することっ てなにがあるかな🤔
 54

Slide 55

Slide 55 text

質問について~役割を与える~
 アンチパターン
 55

Slide 56

Slide 56 text

56

Slide 57

Slide 57 text

57

Slide 58

Slide 58 text

質問について~役割を与える~
 - 一見良さそうに見えるが、あまり技術的な答えになっていな い
 58

Slide 59

Slide 59 text

質問について~役割を与える~
 解決策
 役割を与える
 - 「あなたは〇〇です」という役割を与える
 - 「あなたはプロのインフラエンジニアです」という役割を与え る
 59

Slide 60

Slide 60 text

60

Slide 61

Slide 61 text

61

Slide 62

Slide 62 text

62

Slide 63

Slide 63 text

質問について~役割を与える~
 問題解決!
 - 役割を与えると、より質の高い回答が生成される
 63

Slide 64

Slide 64 text

質問について
 ~注意点~
 64

Slide 65

Slide 65 text

質問について~注意点~
 注意点は主に3つ
 1. 情報の正確性
 2. 倫理観
 3. セキュリティ
 65

Slide 66

Slide 66 text

質問について
 ~情報の正確性~
 66

Slide 67

Slide 67 text

質問について~情報の正確性~
 - 情報が本当に正しいか、再度ググる必要がある
 - 宮城県大崎市の観光名所を尋ねると実在しない地域や違う 地域が返ってくる
 67

Slide 68

Slide 68 text

68

Slide 69

Slide 69 text

質問について~情報の正確性~
 - 一つも大崎市にないです
 - Google Bardだとネット接続があるので、実在する地域を教 えてくれました
 69

Slide 70

Slide 70 text

質問について
 ~倫理観~
 70

Slide 71

Slide 71 text

質問について~倫理観~
 - 最適解を導くために、合理的な手段が返ってくる
 - 宗教的にNGだったり、人種差別、セクハラ、パワハラ、その 他人道に反することがある
 71

Slide 72

Slide 72 text

72

Slide 73

Slide 73 text

73

Slide 74

Slide 74 text

質問について~倫理観~
 - ちょっとセクハラっぽい
 74

Slide 75

Slide 75 text

質問について
 ~セキュリティ~
 75

Slide 76

Slide 76 text

質問について~セキュリティ~
 - もし業務で使用する場合は、社外秘の情報を入力すること は絶対にやめましょう
 - ChatGPTに入力する前に誰かにチェックしてもらうなど対策 が必要
 76

Slide 77

Slide 77 text

質問について
 ~まとめ~
 77

Slide 78

Slide 78 text

質問について~まとめ~
 - ガベージイン、ガベージアウト
 - ゴミを入れたらゴミが出てくる
 - 入力にもコツがある
 - 制限、前提、役割を与える
 - 注意点
 - 情報の正確性、倫理観、セキュリティに気をつける
 78

Slide 79

Slide 79 text

質問について
 以上です
 79

Slide 80

Slide 80 text

テストコードの生成
 80

Slide 81

Slide 81 text

今日は3つのことをお話します
 1. ChatGPTってなに?
 2. 質問について
 3. テストコードの生成 <- 今ここ、これで最後です
 81

Slide 82

Slide 82 text

テストコードの生成
 ~実装の作成~
 82

Slide 83

Slide 83 text

テストコードの作成~実装の作成~
 - まずは実装側を作成します
 - 今回は3の倍数と5の倍数のfizzbuzzを作成します
 83

Slide 84

Slide 84 text

84

Slide 85

Slide 85 text

85

Slide 86

Slide 86 text

テストコードの作成~実装の作成~
 - 作成完了
 86

Slide 87

Slide 87 text

テストコードの生成
 ~テストの作成~
 87

Slide 88

Slide 88 text

テストコードの作成~テストの作成~
 - 作成された実装コードを元に1パターン分のテストクラスを作 成していきます
 88

Slide 89

Slide 89 text

テストコードの作成~テストの作成~
 下記の制限をChatGPTに追記します
 - PHPUnitの使用
 - テストクラスは別クラス
 - テスト名は日本語
 89

Slide 90

Slide 90 text

90

Slide 91

Slide 91 text

91

Slide 92

Slide 92 text

テストコードの作成~テストの作成~
 - 簡単にテストコードが作れました
 92

Slide 93

Slide 93 text

93

Slide 94

Slide 94 text

テストコードの作成~テストの作成~
 - 「私は初心者です」という前提を与えたので、PHPUnitの実 行方法まで添えてくれました
 - テストに慣れている人は「私は上級者です」などを入れてお くと余計な解説などが省かれますのでいれてください
 94

Slide 95

Slide 95 text

テストコードの作成~テストの作成~
 - 実際にテストを流していきます
 95

Slide 96

Slide 96 text

96

Slide 97

Slide 97 text

テストコードの作成~テストの作成~
 - 成功しました!
 97

Slide 98

Slide 98 text

テストコードの作成~テストの作成~
 - 続いて、テストパターンを増やしていきます
 98

Slide 99

Slide 99 text

99

Slide 100

Slide 100 text

テストコードの作成~テストの作成~
 簡単に追加パターンが作れました
 - 5の倍数のテストパターン
 - 3と5の共通の倍数のテストパターン
 
 100

Slide 101

Slide 101 text

テストコードの作成~テストの作成~
 テストを流します
 101

Slide 102

Slide 102 text

102

Slide 103

Slide 103 text

テストコードの作成~テストの作成~
 - 成功しました!
 103

Slide 104

Slide 104 text

テストコードの作成~テストの作成~
 - これでみなさんの開発スピードが上がりました
 - 更に加速させます!!
 104

Slide 105

Slide 105 text

テストコードの作成
 ~GitHub Copilot~
 105

Slide 106

Slide 106 text

テストコードの作成~GitHub Copilot~
 ChatGPT + GitHub = GitHub Copilot
 主操縦士ではなく副操縦士、サブです
 106

Slide 107

Slide 107 text

テストコードの作成~GitHub Copilot~
 - 時間の都合のため、GitHub Copilotのアカウント作成方法は 割愛します
 - PHPStormにGitHub Copilotプラグインをインストールしてく ださい
 - 先ほど作成したfizzbuzzのテストコードをPHPStormで開きま す
 107

Slide 108

Slide 108 text

108

Slide 109

Slide 109 text

テストコードの作成~GitHub Copilot~
 - この状態から新たに4つ目のテストパターンを作成します
 - 最後のテストパターンのメソッドの末尾から「Enter」を2回押 して2秒ぐらい待ちます
 109

Slide 110

Slide 110 text

110

Slide 111

Slide 111 text

テストコードの作成~GitHub Copilot~
 - うっすら4つ目のテストパターンがCopilotに提案されました
 - 「3でも5の倍数でもないときは数値を返すこと」というテスト パターンが抜けていたようです
 - この状態で「TAB」を押します
 111

Slide 112

Slide 112 text

112

Slide 113

Slide 113 text

テストコードの作成~GitHub Copilot~
 - 新しいテストパターンが追加されました
 - 今まではChatGPTにコードを入力して、新しいテストパター ンをコピーしていたのですが、その手順が省略されるように なりました
 - こちらもテストを流します
 113

Slide 114

Slide 114 text

114

Slide 115

Slide 115 text

テストコードの作成~GitHub Copilot~
 - テストも無事成功しました
 - これでみなさんの開発スピードが爆速になりました
 115

Slide 116

Slide 116 text

テストコードの作成~GitHub Copilot~
 - 同じ作業を手作業でしてみたところ12分かかりました
 - 今回の作業を計測したところ4分で終わりましたので、作業 時間が3分の1に減りました
 - ぜひみなさんも使ってみてください
 116

Slide 117

Slide 117 text

テストコードの作成
 ~まとめ~
 117

Slide 118

Slide 118 text

テストコードの作成~まとめ~
 - ChatGPTを使うと全体の作業時間が半分以下になる
 - 実装、テスト、テスト用コマンド、なんでもChatGPTがやってく れる
 - GitHub Copilotも併用すると、テストパターンの追加が簡単 になる
 118

Slide 119

Slide 119 text

テストコードの作成
 以上です
 119

Slide 120

Slide 120 text

全体のまとめ
 120

Slide 121

Slide 121 text

まとめ
 - ChatGPTは手前の単語から次の単語を予測している
 - ガベージイン、ガベージアウト
 - ゴミを入れたらゴミが出てくる
 - 制限、前提、役割を与える
 - ChatGPTを使うとテストコードは簡単に作れる
 - GitHub Copilotは神
 121

Slide 122

Slide 122 text

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