Bolt / Lovable入門 ── ブラウザだけでアプリが作れるノーコードAI

ブラウザで完結する最も手軽なバイブコーディング

「ターミナルもエディタもわからない。とにかく何か作ってみたい」──そんな人に最適なのがBoltとLovableだ。

ブラウザを開いて、作りたいものを日本語で入力するだけ。AIがコードを生成し、プレビューを表示し、そのまま公開までできる。

BoltとLovableの違い

	Bolt	Lovable
開発元	StackBlitz	Lovable（旧GPT Engineer）
強み	フロントエンド全般	UIデザインが美しい
コード表示	あり（編集可）	あり（編集可）
デプロイ	ワンクリック	ワンクリック
料金	無料枠あり	無料枠あり

💡

迷ったらBolt

どちらもほぼ同じことができる。迷ったらBoltから始めるのがおすすめ。慣れたらLovableも試してみよう。

Boltの使い方

ステップ1: アクセス

bolt.new をブラウザで開く。アカウント登録（無料）。

ステップ2: 指示を入力

ToDoアプリを作ってください。
- タスクの追加、完了、削除ができる
- デザインはモダンでシンプル
- ダークモード対応

ステップ3: 待つ

AIがReact + Tailwind CSSでアプリを生成。右側にプレビューが表示される。通常30秒〜1分。

ステップ4: 修正する

完了したタスクに取り消し線を追加して。
あと、タスクの数を上部に表示して。

修正指示を出すたびにAIがコードを更新。

ステップ5: 公開する

「Deploy」ボタンでワンクリック公開。URLが発行され、誰でもアクセスできる。

料金

Bolt

プラン	月額	トークン
Free	$0	日次制限あり
Pro	$20	1,000万トークン/月
Team	$40	2,000万トークン/月

Lovable

プラン	月額	メッセージ数
Free	$0	5プロジェクトまで
Starter	$20	100メッセージ/月
Pro	$50	500メッセージ/月

Bolt/Lovableの限界

⚠️

できないこと

バックエンド（サーバー側）の複雑な処理
データベースの本格的な管理
大規模アプリの開発
細かいパフォーマンス最適化

これらが必要になったら、Claude CodeやCursorにステップアップしよう。

こんな人におすすめ

プログラミング完全未経験
まず「何か動くもの」を作る体験がしたい
ターミナルやエディタのインストールが面倒
アイデアを素早くプロトタイプにしたい

BoltとLovableは、バイブコーディングの「最も低いハードル」だ。ブラウザさえあれば、今すぐアプリが作れる。まず一つ作ってみて、もっと高度なことがしたくなったらCursorやClaude Codeに進もう。

次のステップ: ツールを選んだら、実践編で実際にプロジェクトを作ってみましょう。