新進気鋭のAI対話型のフルスタックWeb開発ツール「bolt.new」とは？
先日発表されたばかりの AI ツールである bolt.new について解説していこうと思います。
実際に使ってみた記事は別で書いているので、気になる方は見てみてください
bolt.new とは
bolt.new は、ブラウザ上で直接フルスタックアプリケーションの開発、実行、編集、デプロイを可能にする革新的な AI 駆動型の Web 開発エージェントです。
このツールの最大の特徴は、ローカル環境のセットアップが不要な点です。
現在、bolt.new はベータ版となっているようです。
技術的特徴
bolt.new は、最先端の AI モデルとブラウザ内開発環境を統合しています。
これにより、従来の AI アシスタント（Public Beta になった v0など）では不可能だったパッケージのインストール、バックエンドの実行、コードの編集が可能になりました。
開発会社
bolt.new はStackBlitzが開発を行っています。
StackBlitz は Web エンジニアであれば一度は目にしたことがあると思いますが、オンラインの開発環境を提供している会社です。
主な特徴
AI による環境制御
- 従来の開発環境とは異なり、AI モデルがファイルシステム、Node サーバー、パッケージマネージャ、ターミナル、ブラウザコンソールを完全に制御
- アプリケーションの作成からデプロイまで、チャットのみで操作可能
ブラウザ内でのフルスタック開発
- StackBlitz の WebContainers を利用した開発環境
- npm ツールやライブラリ（Vite、Next.js など）のインストールと実行
- Node.js サーバーの実行
- サードパーティ API との対話
- チャットからの本番環境へのデプロイ
- URL を介した作業の共有
使い方のヒント
使い方のヒントが公式に書いてあったので、日本語訳してまとめます
- スタックの具体的な指定：特定のフレームワークやライブラリ（Astro、Tailwind、ShadCN など）を使用したい場合は、初期プロンプトで明示的に言及する
- プロンプト強化機能の利用：AI モデルを使ってプロンプトを洗練させる
- 基本構造の構築を優先：高度な機能を追加する前に、アプリケーションの基本構造を確立する
- 簡単な指示はまとめて行う：複数の簡単なタスクを 1 つのメッセージにまとめることで、時間と API クレジットを節約
特定のライブラリを使う場合は初期プロンプトで言ってね、とは書いてありますがあとからでもチャットで言えば組み込んでくれたので問題ないとは思います。
ただ、プロジェクトを大きく変えるようなライブラリをあとから導入しようとすると bolt.new 側で対応できなくなるのかもしれないので、そういう意味で初期プロンプトで言及してくださいと書いているのかも。
その他
利用するには StackBlitz への登録（無料）が必要です。
また、無料プランではトークンに上限があるみたいで、有料プランが存在します。
無料プランの上限については記載されているのを見つけられませんでした。
どうやら Claude 3.5 Sonnet を使っているそうなので、Claude 3.5 Sonnet の呼び出し上限までになるのかな？と思います。
もし正確な情報をお持ちの方がいたら教えて下さい。
市場での位置づけと展望
bolt.new は、AI を活用した Web 開発ツールの新たな標準を設定する可能性を秘めています。
従来のコード生成支援にとどまらず、開発環境全体を AI が制御するという革新的なアプローチは、Web 開発の効率と可能性を大きく向上させる可能性があります。
さいごに
bolt.new は、生成 AI と StackBlitz の持っている技術を融合させることで、Web 開発の概念を根本から変える可能性を秘めたツールだと感じました。
ブラウザのみで完結する上に、チャットだけでフルスタックな Web アプリケーションが作れるのは感動モノですね。
しかも、生成されたデザインのクオリティも悪くなかったです。
今後の Web 開発の在り方に大きな影響を与えることになるかもしれません。
時間があれば実践編ということで bolt.new を使った記事も書こうと思います。
→ 書きました
Discussion