Bolt.new：在浏览器中用 AI 开发全栈 Web 应用

The traditional web development workflow follows a predictable pattern: set up a development environment, configure build tools, write code, debug, repeat. Every new project requires installing Node.js, configuring npm, choosing a framework, setting up a database, and wiring everything together. Before writing a single line of business logic, hours pass in environment setup.

Bolt.new eliminates this entirely. It is an AI-powered development environment by StackBlitz that runs completely in the browser. Describe what you want to build — “a two-sided marketplace for freelance designers” or “a real-time dashboard for server monitoring” — and Bolt.new generates, runs, and lets you iteratively refine a complete full-stack application. No local setup, no cloud provisioning, no package installation.

How Does Bolt.new Run Full-Stack Applications in the Browser?

Bolt.new’s technical foundation is StackBlitz’s WebContainer technology. WebContainers are a browser-native Node.js runtime that executes code directly in the browser’s operating system — not through a server-side sandbox or cloud VM. This means Bolt.new applications run with native Node.js performance inside the browser tab.

The architecture is remarkable. WebContainers use a combination of WebAssembly, Service Workers, and filesystem APIs to create a virtualized Node.js environment. npm packages are installed in memory, servers start on localhost ports within the browser, and the generated application is fully functional — database queries execute, API calls resolve, and the frontend renders — all without a single cloud server.

The AI integration layer sits on top of WebContainers. When you describe a feature, the AI analyzes the current project state, generates the necessary code changes, and applies them to the running application. You see the result instantly — the running app updates as code is generated.

How Does Bolt.new’s AI Generate and Iterate on Code?

Bolt.new’s AI follows a structured development loop. When you describe a feature or application, the AI first analyzes the request to understand the technical requirements. It then plans the implementation, considering the existing project structure, framework conventions, and best practices.

The AI generates code file by file, creating the full application structure. For a new project, this means scaffolding the framework (React, Vue, Next.js, Express), installing dependencies, creating component files, setting up routes, configuring the database, and wiring everything together. For existing projects, the AI makes targeted changes — adding components, modifying routes, updating data models.

flowchart LR
    A[用户提示：<br/>"建立含验证的待辦事项应用"] --> B[AI 分析]
    B --> C[技術棧选择]
    C --> D[专案搭建]
    D --> E[前端：React + Router]
    D --> F[后端：Express + SQLite]
    D --> G[验证：JWT + bcrypt]
    E --> H[产生元件]
    F --> I[产生 API 路由]
    G --> J[产生验证中介软体]
    H --> K[安装套件]
    I --> K
    J --> K
    K --> L[启动开发服务器]
    L --> M[执行中的应用]
    M --> N[用户优化]
    N --> B

The iterative refinement loop is Bolt.new’s strength. After the initial generation, you can request changes conversationally — “add dark mode,” “make the layout responsive,” “add pagination to the list view.” The AI understands the full context and makes coordinated changes. This conversational development process is significantly faster than traditional edit-compile-debug cycles.

What Are the Best Use Cases for Bolt.new?

Bolt.new excels at rapid prototyping and MVP development. The combination of zero setup and AI code generation means you can go from idea to working prototype in minutes. This is transformative for founders validating product concepts, developers exploring framework choices, and teams building internal tools.

Full-stack applications with standard architectures are Bolt.new’s sweet spot. CRUD applications, dashboards, API services, authentication flows, and content management interfaces are well within its capability. The generated code follows standard patterns and is structured for maintainability.

For learning and exploration, Bolt.new provides an unparalleled environment. Developers learning React can describe component patterns and see them implemented instantly. Designers can experiment with UI layouts by describing them in natural language. The low friction encourages experimentation.

Applications built with Bolt.new are standard web apps that can be extended with traditional development tools. You can clone a Bolt.new project and continue development locally, or export the codebase for team collaboration.

How Does Bolt.new Handle Project Export and Deployment?

When development reaches a satisfactory state, Bolt.new provides multiple paths to production. The one-click deployment to Netlify, Vercel, or Cloudflare Pages handles the build and deployment pipeline automatically, configuring environment variables, build commands, and deployment triggers.

For teams that need more control, Bolt.new supports project export as a standard web application codebase. The exported project includes all configuration files (package.json, framework config, build scripts) and can be pushed to a Git repository for team collaboration. The code maintains standard project conventions — no Bolt.new-specific build steps or proprietary configuration.

The deployed application is a standard web app running on the chosen hosting provider. There is no ongoing dependency on Bolt.new — the generated code is self-contained and deployable anywhere Node.js applications run.

FAQ

What is Bolt.new and how does it work? Bolt.new is an AI-powered browser-based web development environment. Describe your application in natural language, and it generates and runs a complete full-stack app using WebContainers technology.

What kind of applications can Bolt.new build? React, Vue, Angular, Svelte frontends; Express, Next.js, Nuxt backends; SQLite databases; API services; e-commerce sites; dashboards; and landing pages.

How does Bolt.new handle AI code generation? Bolt.new uses frontier LLMs with full project context to generate coordinated code changes across files, install packages, and run the application in real time.

Is Bolt.new open source? Yes. StackBlitz open-sourced Bolt.new, including the AI integration layer, WebContainer configuration, and frontend.

Can I deploy Bolt.new applications? Yes. One-click deployment to Netlify, Vercel, and Cloudflare Pages is supported, and the generated code is compatible with any Node.js hosting provider.

References

• Bolt.new GitHub Repository
• StackBlitz Bolt.new Official Site
• WebContainer Technology
• StackBlitz Platform