Bolt.new Guide 2025: Build Web Apps with AI in Minutes
Bolt.new turns a single prompt into a running React + Vite + Tailwind app in seconds — with Supabase database, Netlify deployment, and a token-based model that scales from hobbyist to team. Here is everything you need to know to build, iterate, and ship.
1. What is Bolt.new — and how does it compare to Lovable and v0?
Bolt.new is an AI-powered full-stack web app builder by StackBlitz. You describe an app in a prompt and Bolt generates a complete codebase, runs it in a browser-based IDE, and lets you iterate in real time — no local Node.js install, no Git setup, no deploy pipeline to configure.
Bolt.new vs Lovable vs v0 — quick comparison
| Tool | Best for | Pricing model | Default stack |
|---|---|---|---|
| Bolt.new | Full-stack apps with backend | Token-based | React + Vite + Tailwind |
| Lovable | GitHub sync + team collab | Credit-based | React + Supabase |
| v0 (Vercel) | Next.js UI components | Credit-based | Next.js + shadcn/ui |
Key difference: Bolt uses a token model, not credits — meaning larger and more complex generations cost more per request, but you don't hit a hard "credits ran out" wall in the middle of a feature.
2. Creating your first app — one prompt to full-stack
Go to bolt.new and type a prompt. Bolt works best when you're specific about the tech, layout, and behaviour you want from the first message.
"Build a React task manager with Tailwind CSS. Sidebar showing project folders on the left. Main area shows task cards with title, due date, and a status badge (Todo / In Progress / Done). Cards should be draggable between columns. Store state in localStorage."
"Make me a todo app"
After the first generation, Bolt opens a live preview on the right and a file editor on the left. You can edit code directly or use follow-up prompts to refine the result.
3. Tech stack Bolt.new uses by default
Bolt scaffolds a modern React stack out of the box. You can ask it to use alternatives (Vue, Svelte, vanilla JS) but the defaults are production-ready:
React 18 + Vite — fast HMR, ESM-native bundler, TypeScript support out of the box.
Tailwind CSS — utility-first styling. Bolt uses Tailwind classes throughout generated components.
Supabase — the default backend-as-a-service for auth, database, storage, and real-time. One-click integration from the Bolt panel.
StackBlitz WebContainers — the underlying runtime. Node.js runs directly in your browser tab; no server-side execution needed.
4. Connecting a database — Supabase one-click setup
Bolt has a native Supabase integration that handles schema creation, SQL migrations, and client code generation automatically.
Click Connect to Supabase in the Bolt project sidebar (the database icon).
Authenticate with your Supabase account and select an existing project or create a new one.
Tell Bolt what data you need: "Add a tasks table with columns: id, title, status (enum: todo/in-progress/done), created_at, user_id." Bolt writes and runs the migration.
Bolt auto-generates the Supabase client, Row Level Security policies, and CRUD operations in your React components.
Note: The free Supabase plan includes 500MB database, 1GB storage, and 50,000 monthly active users — enough for a personal project or MVP.
5. Exporting and deploying — Netlify, ZIP, or StackBlitz
Once your app is ready, you have three exit paths:
Deploy to Netlify (recommended)
Click the Deploy button → connect your Netlify account → Bolt pushes the build and gives you a live URL in ~60 seconds. Free Netlify plan handles most hobby projects (100GB/month bandwidth).
Download ZIP
Click Download to get the full project as a ZIP. Unzip and run npm install && npm run dev locally. Then push to any host: Vercel, Cloudflare Pages, Railway.
Open in StackBlitz
Click Open in StackBlitz to continue editing in the full StackBlitz IDE with more file management options, git integration, and shareable preview URLs.
6. Prompting tips for Bolt — specificity, iteration, and "fix" commands
Bolt's AI responds best to precise, structured prompts. These patterns consistently produce better results:
"Add a modal component that opens when clicking 'New Task'. The modal should have a title input, description textarea, due date picker, and a priority dropdown (Low/Medium/High). Close on backdrop click or Escape key."
"Only change the sidebar: make the project folders collapsible with an expand/collapse arrow. Don't touch any other component."
"Fix the console error: Cannot read properties of undefined (reading 'map') in TaskList.tsx line 24. The tasks prop might be undefined on first render."
"Only edit the Button component in src/components/Button.tsx — change variant='primary' background from blue-600 to violet-600 and update hover state to violet-700."
Token tip: Narrow prompts that touch one file or one component use far fewer tokens than asking Bolt to "update the whole app to be dark mode." Scoped changes = cheaper iterations.
7. Bolt.new plans — free 150k tokens/day, Pro $20/mo, Teams $30/user
Bolt uses a token-based pricing model, not a credit model. Every AI generation consumes tokens proportional to the complexity of the code generated — a simple component uses ~5,000 tokens; a complete full-stack scaffold can use 100,000+ tokens in one go.
| Plan | Price | Tokens | Best for |
|---|---|---|---|
| Free | $0 | 150,000/day | Learning, small experiments |
| Pro | $20/mo | 10M tokens/month | Freelancers, indie hackers |
| Teams | $30/user/mo | Unlimited | Agency teams, collaboration |
Monitor Bolt.new uptime
Bolt.new outages interrupt active builds mid-generation. Track Bolt.new status alongside Supabase, Netlify, and 75+ AI services at prismix.dev — get a free email alert the moment anything degrades.
FAQ
What is Bolt.new?
Bolt.new is an AI-powered full-stack web app builder by StackBlitz. You describe an app in a prompt and Bolt generates a complete React + Vite + Tailwind codebase in seconds — no local setup required. It runs entirely in the browser and supports Supabase, Netlify, and GitHub integrations.
How does Bolt.new token pricing work?
Bolt.new uses a token-based model. Free plan: 150,000 tokens/day. Pro ($20/mo): 10 million tokens/month. Teams ($30/user/month): unlimited tokens. Larger or more complex generations consume more tokens per request — a full-stack app build can use 50,000–150,000 tokens in one go.
How is Bolt.new different from Lovable and v0?
Bolt.new: best for full-stack apps with backend (Supabase, APIs), runs in StackBlitz browser IDE, token model. Lovable: stronger GitHub sync and collaboration features, credit model. v0 (Vercel): best for Next.js UI components, deepest Vercel/shadcn integration, designed for frontend first.
Can Bolt.new connect to a database?
Yes. Bolt.new has a one-click Supabase integration. Click 'Connect to Supabase' in the project panel, authenticate, and Bolt can create tables, write SQL migrations, and generate Supabase client code automatically. You can also use any REST API or Firebase manually.