この記事は【カヤック】面白法人グループ Advent Calendar 2024の24日目の記事です。
おはこんばんちは。らりです。
2週間前に給湯器が壊れ、水を浴びながら生きてます。
インフルエンザも流行ってるし仕方ないですね。
はじめに
近年ではAIが進化し、もはや人間と区別がつかなくなってきました。
昨今のAIについては色々議論が巻き起こっていますが、本当に仕事を奪われそうでSFじみてきましたね。
ロボット工学三原則には「仕事を奪ってはならない」とは無いので、どこかで付け足されるのでしょうか。
ところで、簡単なプロジェクトを淡々とAIに作ってもらう検証をしてみました。
お題は電卓で、色々機能を付け足してもらえるかなと思いました。
用意
方法としては、
- 定期的にAIにコードを生成させる
- 勝手にPRを立ててもらう
- 勝手にページをビルドしてもらう
- 勝手にマージしてもらう
って順番です。
生成AIはGeminiを使い、勝手に色々するのはGitHub Actions、ページはGitHub Pagesを使います。
Geminiの生成間隔と、Actionsの実行時間を考慮すれば、全部タダです！万歳！
方法
ファイルの配置は以下のようになります。
git.ts
src/
index.html
ts/
index.ts
style/
style.scss
git.tsの中には、コード生成からPRを立てるところまでを記述します。
PRを立てるのにはOctokitを使いました。
git.tsを走らせるためにcronを使っているのですが、課金にひよって30分に1回実行するようにしてます。
ただ、コードを変更して実際に動くか確認したいため、workflow_dispatchを用意しておくことで、GitHub上でボタン1つで実行出来るようにしてます。
docs.github.com
プロンプトの作成にはここを参考にしました。 dev.classmethod.jp 以下がプロンプトです。
下記に幾つかの要求のポリシーを示します。これに従って回答してください。
- 回答は下記JSON SCHEMAに合致するJSON形式で実施してください。
- 他の受け答えや回答は不要です。
- 返答はJSONのみで返してください。codebaseの表記に沿う必要はありません。
{
"$schema": "http://json-schema.org/draft-07/schema#",
"type": "object",
"properties": {
"html": {
"type": "string"
},
"ts": {
"type": "string"
},
"css": {
"type": "string"
},
"description": {
"type": "string"
},
"title": {
"type": "string"
}
}
}
- 上記JSON SCHEMAのプロパティの意味は下記です
- html: HTMLコード ファイルパスは'/src/index.html'です
- css: SCSSコード ファイルパスは'/src/style/style.scss'です
- ts: TypeScriptコード ファイルパスは'/src/ts/index.ts'です
- description: PRの説明文
- title: PRのタイトル
以下の<codebase/>はコード内容です。
--------------------------------------------------------
<codebase>
\`\`\`html
${fs.readFileSync("src/index.html", "utf-8")}
\`\`\`
\`\`\`ts
${fs.readFileSync("src/ts/index.ts", "utf-8")}
\`\`\`
\`\`\`css
${fs.readFileSync("src/style/style.scss", "utf-8")}
\`\`\`
</codebase>
これらをコード踏まえ、下記の要求に合致するコードを生成してください。
- 絶対条件として、電卓が表示されるページを作成してください。
- webページで見たり触れたりできるようにしてください。
- 既存コードから何か1つ機能を追加してください
AIは欲しい答え以外に受け答えもするので、それは全部やめていただきます。
また、その下に自分の求めている内容を記述します。
今回であれば、常に新しい機能を足してもらいたいので、それも追加しています。
これにより、いつ見ても新たな機能が足されている電卓が出来上がる想定です。
このプロジェクトでは、PRを立てるためのキーは自分自身ではなく、1つGitHub Appを作り、そのキーを用いています。 検証してませんが、自分自身のキーを使うと、コミットやPRによる草が生えてしまうかもしれないと思ったからです。
また、マージにはsecrets.GITHUB_TOKENを使っています。
Appなどのbotのマージは自動で行われないため、GitHub Actionsで行う必要があります。
docs.github.com
マージ後も勝手にデプロイを行えないため、マージ前に行ってしまいます。
github.com
これらにより、コードの自動生成からPRを立て、デプロイまで走って勝手にマージされます。 終わったブランチは勝手に消えるので、立つ鳥跡を濁さずという感じです。
運用中の感想
全然上手くいかない...
というより、プロンプトが薄すぎて、出てくるコードもふわふわしたものが多い気がします。
また、cssを全然書いてくれないので、見た目が全然電卓になりません。
この辺りは足りないプロンプトを追加していって、ちょっとずつ理想に寄せていく必要があるのかなと思います。
ただ個人的に、AIにテキストベースの成果物を出してもらって何かするっていうのはどこかに応用出来そうな気がしてます。
正誤はともかく、処理に莫大な時間がかかるものとかには代替出来そうな感じがします。
量子コンピュータみたいですね。
