Bolt.newとは何か

Bolt.newはStackBlitzが開発したAI Webアプリビルダーだ。ブラウザ上でプロンプトを入力するだけで、フルスタックのWebアプリを生成してくれる。コードを書く必要はない。

生成されたアプリはそのままブラウザ内で動作確認でき、デプロイボタンひとつで公開もできる。「アイデアをすぐに形にしたい」という用途に特化した設計だ。

実際に30分で作ってみた

「料理のレシピを管理するアプリを作って。材料と手順が入力できて、カテゴリで絞り込めるようにしたい」と入力してみた。

数分後には、Reactで作られたレシピ管理アプリが生成された。CRUDの基本操作が揃っており、カテゴリフィルタも動いていた。UIもそれなりに整っており、プロトタイプとしては十分な品質だった。

その後「レシピ詳細ページに調理時間を追加して」「ダークモードに対応させて」と指示を追加すると、会話形式で修正されていく。この反復サイクルが速く、30分の間にかなり実用的な形まで仕上げられた。

技術的な背景

Bolt.newの裏側ではClaude（AnthropicのAPI）が動いている。生成されたコードはWebContainers技術によってブラウザ内で実行される。サーバーが不要な仕組みのため、生成から動作確認まで完結している。

対応フレームワークはNext.js、Remix、Astro、React+Viteなどが主なところで、バックエンドとしてSupabaseやFirebaseとの連携も可能だ。

できること・できないこと

できること

  • プロトタイプの素早い生成
  • シンプルなCRUDアプリの構築
  • UIのイテレーション（変更指示を会話で繰り返す）
  • Netlifyへのワンクリックデプロイ
  • 生成されたコードをZIPでダウンロード

できないこと・苦手なこと

  • 複雑なビジネスロジックの実装
  • 既存の大規模コードベースへの統合
  • 本番レベルのセキュリティ要件への対応
  • 特定のAPIとの詳細な連携（認証フローが複雑な場合）

Lovableとの違い

同じカテゴリのツールとしてLovableがある。Bolt.newとLovableを両方使ったうえでの印象を書いておく。

Bolt.newはスピード重視で、とにかく速く動くものを出してくれる。技術スタックの指定がしやすく、生成されたコードをすぐにダウンロードして手元で続きを書くという使い方に向いている。

LovableはUI品質とユーザー体験の磨き込みに強みがある。ビジュアルの完成度が高く、「見た目がいいプロダクト」を目指す場合はLovableの方が近道になることが多い。

Claude Codeとの使い分け

Bolt.newとClaude Codeは競合するというより、用途の棲み分けがはっきりしている。

Bolt.newは「ゼロからブラウザで素早くプロトタイプを作る」のに向いている。コードを書かずに形にしたい場合はBolt.newが圧倒的に速い。

Claude Codeは「ローカルの既存プロジェクトに組み込む、本番を意識した開発」に向いている。生成物の品質管理やgit連携など、エンジニアリングの流儀を踏まえた作業が必要な場面ではClaude Codeが適している。

料金

無料プランは月10トークン（大まかには10セッション相当）から始められる。Proプランは月20ドル程度で、かなり多くのプロジェクトが作れる。プロトタイピング用途なら無料プランでも十分感触はつかめる。

まとめ

Bolt.newはアイデアを速く形にするための優れたツールだ。エンジニアでなくても使えるため、企画職やデザイナーが自分でプロトタイプを作って意思決定に使う場面で本領を発揮する。ただし本番品質のアプリを作るためのツールではないので、プロトタイプの先は別の手段が必要になることを念頭に置いておこう。