はじめに
こんにちは、虎の穴ラボで Fantia の機能開発をしている awamo です。
年末のアドベントカレンダーでHoshiさんが発表していた記事で興味を持ち、1月20日前後にBolt.newを触ってみました。
動機
- 自分で動かして、AIコード生成の動作や気をつける必要のある箇所を知りたい(v0、Cursor、Clineなども興味あり)
- Supabaseでどこまでできるか試したい
- Bolt.new のみでデプロイまで一貫してできるか試したい
- TS/JSのフレームワークを触ってみたい
- 個人用にレシピを管理して、検索まで簡単にしたい
前提
- 生成AIを利用してWEBアプリを作るのは初めて(Copilotは除く)
- 主にRails のプロジェクト経験が多い
- Reactのプロジェクト経験は少ない
- Next.jsのプロジェクト経験はない
- デザインに関してはCSS, Bootstrapでなんとかしてきた
- 自費で一月だけ Proプランに加入して実施
まず初めに、なるべく曖昧さを減らすため、ChatGPTと要件定義を行い、要件定義書を作成しました
実装
作成した要件定義書の指示のみでは動かず、作成した画面と画面の繋ぎこみなどの指示をする必要がありました。
翻訳を入れると、指示していない画面には翻訳が入らず、エラー頻度が増えて行きました。
全ての画面に修正を入れるような対応は、動作が怪しくなります。
DBアクセスの機能を追加すると、再ロードを繰り返してしまう事象が発生しました。
原因を大まかに指定して対策をするように伝える必要はありましたが、修正されました。
上記の動作は、既存のコードが消えてしまう現象によって引き起こされていました。
怠業(Lazy)とその原因
これらの問題は、怠業(Lazy)と呼ばれる動作が原因でした。
コンテキストが膨大になると起きる、修正不要箇所に対するコメントをして既存のコードを消してしまう動作や、修正内容を指示するコメントのみを行う動作です。
特にテーブルの表示や操作に関しては怠業が顕著で、作業中にテーブル定義用のSQLを消してしまった結果、存在しないテーブルを参照しようとすることが多かった印象です。
主に翻訳、DBアクセス、追加画面の作成を行うと、怠業の頻度が上がっていきました。
ただし、この問題は1月22日に解消されたとのリリースが出ているので、もしかしたら現在は起きなくなっているかもしれません。
🧠 Bolt will no longer be lazy and omit code! pic.twitter.com/iMTsIVIwvB
— bolt.new (@boltdotnew) 2025年1月21日
また、Supabaseとの連携ができるとのことでしたが、Next.jsにはまだ対応していないようでした(RemixならOKなのかは要確認ではあるかと思います)。
1月分のトークンは、主に怠業が起きる点からすぐに消費されてしまい、私個人の資金では完成までは持っていけませんでした。
しかし、外観がある状態にはなるので、0→1ではなく、既存プロダクトに途中参画する時に近い形で進められるようになります(いいか悪いかはありますが...) 。
できたもの
結果的に、デプロイまで全てを任せ切ることはできませんでしたが、自身だけでは短時間に作ることはできないようなアプリが出来上がりました。
おわりに
通常の開発とは感覚がだいぶ異なりますが、React/Next.jsなどの知識が薄い私でもそれなりに動くアプリを作り切ることができました。
特に印象的なのは、普段長い時間頭を悩ませているデザインについて、ほぼお任せで出来上がった点です。 個人で作った場合は何日も検討していた部分が数時間でできていくので、その点では大分楽ができた印象でした。
まとめると、以下の点が気にはなりつつ、開発の立ち上がりが大分早くなるサービスであるように思えます。
- やりとりが増えると怠業も増えるため、作成完了まで持っていきたければそれなり以上に資金が必要そう(公式で対策をしたとの広報あり)
- React/Next.jsの知識がないと、適切な指示が出せず、トークンを浪費しそう
- 画面の製造は指示が曖昧でも意図を汲んでくれるが、動作についてはそうではない
- Next.jsではSupabaseとの連携が(まだ)できない
次は Cline や v0 なんかも触って、どこが違っているのかもみてみたいですね。
Fantia開発採用情報
虎の穴ラボでは現在、一緒にFantiaを開発していく仲間を積極募集中です!
多くのユーザーに使っていただけるtoCサービスの開発をやってみたい方は、ぜひ弊社の採用情報をご覧ください。
toranoana-lab.co.jp