Slide 1

Slide 1 text

Replit Agent を使ってみた。 AIがWebアプリを 作ってくれるぞ! (うそくさい)

Slide 2

Slide 2 text

川口 恭伸 かわぐち やすのぶ Twitter: @kawaguti YesNoBut株式会社 代表取締役社長 アギレルゴコンサルティング株式会社 シニアアジャイルコーチ 一般社団法人スクラムギャザリング東京実行委員会 代表理事 一般社団法人 DevOpsDays Tokyo 代表理事

Slide 3

Slide 3 text

https://chatgpt-lab.com/n/nccc10e804eba

Slide 4

Slide 4 text

だいたいの概要 Web上の開発環境として老舗の Repl.it の AIエージェント機能。 コード生成だけでなく、 ホスティングと結びついて、 デプロイから本番稼働までできる。

Slide 5

Slide 5 text

要は、 チャットボットが コミットする。

Slide 6

Slide 6 text

ファイル

Slide 7

Slide 7 text

作業中

Slide 8

Slide 8 text

チャット

Slide 9

Slide 9 text

作業中 シェル Git デプロイ タブで 切り替え

Slide 10

Slide 10 text

作業する→ デプロイ Git push → commitはエージェントがおこなう

Slide 11

Slide 11 text

要求の提示

Slide 12

Slide 12 text

←ここで作業承認ボタンを押す タスク開始 仕様の確認

Slide 13

Slide 13 text

←タスクの宣言 ←ファイルの編集 ←タスクの宣言 ←開発サーバ起動 ←スクショ取得 ←コミット ←受入テスト要請

Slide 14

Slide 14 text

作業中ペインで Web画面が 起動するので、 自分で操作して 受け入れ確認を 行う。

Slide 15

Slide 15 text

追加要望 の提示

Slide 16

Slide 16 text

←受入テスト要請 ←受入テスト完了 ←タスク完了確認 ←Gitコミット ←デプロイボタン

Slide 17

Slide 17 text

デプロイ実施 Provision Build Bundle Promote

Slide 18

Slide 18 text

本番に反映される

Slide 19

Slide 19 text

Gitコミット履歴は チャットの応答

Slide 20

Slide 20 text

作業する→ デプロイ Git push → commitはエージェントがおこなう

Slide 21

Slide 21 text

むっちゃ かわいいので ぜひ使ってみて ほしいです。 全国のスクフェス を地図表示する アプリを作ってみた

Slide 22

Slide 22 text

使ってみた感じ 優しく原状復帰を繰り返して、 Baby Steps で指示するとよさげ。 手は早いが慎重さに欠ける 新人さんに仕事をお願いしている 感じ。(仕組みの理解は必要)

Slide 23

Slide 23 text

No content

Slide 24

Slide 24 text

これはまさにPOの動き プロダクトオーナー(PO)の 練習にもってこいかもしれない。 開発者が理解できる粒度で バックログを提示して、 質問に答えながら、 有限時間内に実装してもらう。

Slide 25

Slide 25 text

顧客 PO スクラム マスター 開発者たち アウトプット アウトカム プロダクト オーナー

Slide 26

Slide 26 text

顧客 PO スクラム マスター 開発者たち アウトプット アウトカム プロダクトオーナー は、各種の要望を 「実現可能な仕様」 に落として、 バックログに積み、 優先順位付けして ROIを高く保つ。 プロダクト オーナー

Slide 27

Slide 27 text

顧客 PO スクラム マスター 開発者たち アウトプット アウトカム 開発したものは アウトプット、 それを利用して エンドユーザーが 得られる成果が アウトカム。

Slide 28

Slide 28 text

顧客 PO スクラム マスター 開発者たち アウトプット アウトカム なるべく少ないアウトプットで、 アウトカムを得たい Jeff Patton 『ユーザーストーリーマッピング』

Slide 29

Slide 29 text

顧客 PO スクラム マスター 開発者たち アウトプット アウトカム プロダクト オーナー

Slide 30

Slide 30 text

私なりの腹落ち POが仕組みをわかっていると とてもコスパ(ROI)がよくなりそう。 常にリリース可能な状態を保つ アジャイルの学びがそのまま使える。 (そこそこコードもシンプルっぽい)

Slide 31

Slide 31 text

気を付けることは人間と同じ 環境不正や細かいエラーは 作業前に直しておく。 (技術的負債) 45分以上作業して、MP(AIトークン の利用可能量) がすり減っているときに 大きな作業を始めない。

Slide 32

Slide 32 text

結論 Replit Agent を使ってみた。 AIがWebアプリを 作ってくれるぞ! (うそくさい)

Slide 33

Slide 33 text

結論 Replit Agent を使ってみた。 AIがWebアプリを 作ってくれるぞ! (うそくさい)

Slide 34

Slide 34 text

結論 割とここにいる皆さんと 相性がいいツールかなと 感じましたんで、気が向いたら そのうち使ってみたら いいと思いました。 以上

Slide 35

Slide 35 text

あとは細かい話。

Slide 36

Slide 36 text

使ってみた感じ テストコードも書いてくれるが、 こけた E2Eテストはまるで 直してくれなくなった。 シンプルに指示すると、 シンプルに実装してくれる。 割と気持ちいい。

Slide 37

Slide 37 text

使ってみた感じ 逆に、論理的なものや定石は、 すごく早いし気が利いていたりする。 ログインとか管理画面とか。 副作用系(描画不正とか)は、 エージェントからは見えないので、 修正が手間取りがち。

Slide 38

Slide 38 text

使ってみた感じ なので、一歩一歩の受入確認重要。 エージェントが直せないものを 自分で解析して直そうかと思った けど、ロールバックして別の手段を 試すほうが早い。

Slide 39

Slide 39 text

使ってみた感じ なので、あきらめも肝心。 さっさとロールバックする。 エージェントはしばらく使うと リミットに達して5時間使えない。 …ので、問題解決に堂々巡り されるとつらい。

Slide 40

Slide 40 text

使ってみた感じ ポート5000で強制再起動を 依頼すると直してくれる。 開発用サーバーが 中途半端に生きてるのか、 ポートがふさがってて起動しない ことがある。

Slide 41

Slide 41 text

使ってみた感じ もろもろの確認がこけまくるので、 ロールバック。 強制再起動を指示しないと、 新しく5001で起動するように ソースを書き換えて起動してしまう。

Slide 42

Slide 42 text

https://addyo.substack.com/p/the-70-problem-hard-truths-about 割と近しい見解がちゃんと解説されてました

Slide 43

Slide 43 text

むっちゃ かわいいので ぜひ使ってみて ほしいです。