# How to Vibe Code Your Own bolt.new (and Stop Paying for It) > AI-powered, full-stack web development agent and cloud-based application builder - Site: https://bolt.new - Category: AI Code Assistant / Cloud IDE - Platforms: Web app - Verdict: **Serious undertaking** (38/100 vibecodeable) - Estimated effort: 3-6 months of focused engineering work ## Verdict Build a simplified desktop wrapper with an embedded LLM coding loop, but keep paying for Bolt.new to get its production WebContainer environment. Replicating Bolt.new as a solo developer is a serious undertaking because of its core dependency on StackBlitz WebContainers—running a secure, full-stack Node.js environment client-side inside a browser sandbox is an engineering feat built over years. While you can build a desktop or web app that prompts an LLM to generate file structures and write them to disk, achieving the fluid browser-preview-plus-terminal execution loop of Bolt without enterprise infrastructure is exceptionally difficult. ### What you can't replicate - StackBlitz WebContainer secure client-side OS and Node runtime - Proprietary multi-model routing and fine-tuned agent context optimization - Enterprise-grade multi-tenant security, SSO, and BYOK cloud deployment infrastructure ## What it does Bolt.new is a browser-based AI app development agent that lets users prompt the system in natural language to generate, debug, run, and deploy full-stack web applications inside a browser environment. ### Core features - Natural language prompt to full-stack project generation - Browser-based Node.js runtime / WebContainer sandbox execution - Multi-file project file tree view and interactive code editor - Integrated browser preview iframe for live app rendering - Autonomous AI coding agent loop (plan, edit, test, self-correct) - Token usage tracking and management dashboard - One-click deployment and hosting orchestration ## The business ### Pricing - Free: $0 - Pro: $25/mo - Teams: $30/mo per member - Enterprise: Custom ### Funding $135M raised. - Seed (April 2022): ~$7.9M - Series A (November 2024): ~$22M - Series B (January 2025): ~$105.5M at ~$700M valuation Investors: Greylock Partners, Google Ventures (GV), Emergence Capital, Madrona, Mantis, Conviction Founded 2017. Team size: 51-200. ## The hard parts - Running a secure, full Node.js runtime and package manager inside a browser sandbox or isolated container - Context window orchestration: syncing multi-file workspaces back and forth with LLMs without breaking token limits - Robust agentic error-correction loops that can read terminal error outputs and rewrite broken code across multiple files - Managing high inference API costs against fixed subscription pricing models ## How to vibe code bolt.new ### Prerequisites - Node.js (free): Required for running the Next.js development environment and backend agent services. - GitHub (free): Version control and repository hosting for your clone. - Anthropic API Key (Usage-based): Provides Claude 3.5 Sonnet model access for the core code-generation agent loop. ### Recommended AI tools - Claude Code: Unmatched capability for executing complex, multi-file code generation and refactoring tasks from the terminal. - Cursor: Essential for writing and reviewing the complex React UI components and state management logic of your clone. ### Stack - Frontend: Next.js (App Router) + Tailwind CSS + Lucide Icons + Monaco Editor - Backend: Next.js API Routes / Server Actions with LangChain or custom agent loop - Database: Turso (SQLite at the edge for storing user projects, prompts, and file trees) - Auth: better-auth - Payments: Stripe - Other: Anthropic API (Claude Sonnet), PostHog (analytics), Sentry (error monitoring) ### Hosting - Vercel (Hosting the Next.js frontend application dashboard and serverless agent endpoints): $0-20/mo - Turso (Serverless SQLite database for storing user project metadata and conversation histories): $0/mo ### Build guide 1. **Project Scaffolding and Database Schema** — Initialize a Next.js project with Tailwind CSS, configure better-auth, and set up Turso database tables for users, projects, files, and chat messages. ``` Create a new Next.js 16 app with TypeScript and Tailwind CSS. Configure better-auth with email/password and GitHub authentication. Set up a Turso database client using libSQL with schema tables for users, projects (id, name, user_id, created_at), project_files (id, project_id, path, content), and messages (id, project_id, role, content, timestamp). Implement the main dashboard layout with a sidebar listing user projects and a header with user profile management. ``` 2. **Workspace UI & Code Editor Interface** — Build the split-screen workspace interface featuring a chat sidebar for prompting, a file tree explorer, a Monaco code editor for inspecting generated files, and a preview iframe area. ``` Build the main workspace view for a selected project with a three-panel resizable layout using Tailwind CSS. Panel 1: Chat interface with message history and a textarea prompt input. Panel 2: File tree explorer component that renders project_files hierarchically and loads selected files into a Monaco Editor instance. Panel 3: Live preview container with a device toggle header. Ensure state management correctly syncs file selections and updates file content when edited directly in the editor. ``` 3. **Agent Orchestration Engine** — Implement the core AI agent loop using the Anthropic API that parses natural language prompts, generates a multi-file project structure, and streams responses back to the client. ``` Implement a backend API route /api/agent that takes a user prompt and current project file state, and sends them to the Anthropic API using Claude 3.5 Sonnet. Construct a system prompt instructing Claude to return a structured JSON response containing file path modifications or creations (e.g., [{'path': 'src/App.tsx', 'content': '...'}, {'path': 'package.json', 'content': '...'}]) along with an explanatory assistant message. Handle streaming responses, token usage tracking, and database persistence for all generated files. ``` 4. **File Synchronization & Error Handling Loop** — Add self-correction and error-handling mechanisms where the agent reviews terminal or build error outputs and automatically patches broken file references. ``` Enhance the agent orchestration engine to support an iterative self-correction loop. When generated code contains syntax or import errors reported by the client or build check, capture the error log, feed it back to the Claude agent with the affected file contents, and automatically generate corrective file patches. Display agent thinking status indicators ('Planning changes...', 'Writing files...', 'Fixing errors...') in the chat UI during execution. ``` 5. **Deployment & Polish** — Add project sharing capabilities, export features, token usage meters, and finalize UI polish with Sentry error tracking and PostHog analytics. ``` Implement project sharing permissions (public vs private toggle) and a download project feature that packages all project_files into a downloadable .zip archive using JSZip. Add a token usage meter widget in the sidebar showing monthly consumption against limits. Integrate Sentry error tracking and PostHog analytics for user event tracking. Perform end-to-end testing of the prompt-to-code generation workflow. ``` ### Cost vs paying **Starting costs (one-time):** - AI Coding Assistant Subscriptions (Claude Code / Cursor): $20 - Total: $20 one-time **Ongoing costs (monthly):** - Vercel Hosting & Turso Database: $0-5/mo - Anthropic API Usage (Token inference): $10-30/mo - Total: ~$15-35/mo - Paying for the SaaS instead: $25/mo (Pro plan) - Build time: 80-120 hours - AI tool credits: $20 (Claude Code / Cursor Pro) - Break-even: Build is for learning; paying $25/mo is far cheaper than building a full WebContainer clone. ## Sources - [Bolt.new Home & Pricing Pages](https://bolt.new) - [StackBlitz Company Profile & Funding - Wellfound](https://wellfound.com/company/stackblitz) - [CTOL Digital Solutions - Bolt.new Series B Funding](https://www.ctol.digital) - [Medium - AI Coding Platform Wars: Replit vs Windsurf vs Bolt.new](https://medium.com)