Bolt.new 是一款由 StackBlitz 推出的 AI 驱动全栈编程工具,基于 WebContainers 技术实现浏览器端全流程开发,无需本地环境配置。 数据可以连接 Supabase。
体验了下 Lovable 。和 Bolt.new 体验差不多。
核心特性
-
AI 驱动的全栈开发
- 自然语言生成代码:用户可通过自然语言描述需求(如“使用 React 制作待办事项应用”),AI 自动生成完整的前后端代码结构,甚至包含数据库集成。
- 动态安装依赖:支持通过命令直接安装 npm 包(如 Tailwind、OpenAI API),无需手动配置环境。
- 代码修复与优化:集成自动错误检测和修复机制,简化调试流程。
-
云端一体化开发环境
- 零本地配置:基于 WebContainers 技术,直接在浏览器中运行 Node.js、终端和现代工具链(如 Vite、Next.js)。代码也可以在 StackBlitz 中直接编辑,无需额外上传。
- 实时协作与共享:通过 URL 分享项目,支持多人实时编辑,集成 Chrome DevTools 实现浏览器内后端调试。
- 可以通过选择选择元素,截图等方式来和 AI 进行交互。说清楚做成什么样子。
-
一键部署与扩展性
- 快速部署:支持将应用一键发布至 Netlify 等云平台,无需服务器配置。
- 第三方 API 集成:允许与外部服务(如支付接口 Stripe、数据库 Supabase)无缝联动。
-
多框架支持
兼容 React、Vue、Svelte、Astro、Next.js 等主流框架,但对 Nuxt/Vue 的深度支持仍有限。 -
支持接入 Figma。设计稿一键生成 React 组件。这个效果还没试,可以体验下。
二、与竞品对比
工具 | 定位 | 优势 | 局限性 |
---|---|---|---|
Bolt.new | 全栈生成器 | 全流程浏览器开发、AI 生成完整应用、强部署能力 | 对非 React 框架支持较弱,复杂项目需手动优化代码 |
v0 | UI 原型设计 | 专注前端 UI 生成(如 Shadcn 组件库)、实时预览 | 后端功能薄弱,依赖 Vercel 部署,定价较高($20/月) |
Cursor | AI 编程助手 | 深度集成 VS Code、智能代码补全/修复、支持 GPT-4 | 仅限编辑器内使用,全栈开发能力弱,专业版订阅费高($20/月) |
Replit | 教育/协作开发 | 零配置启动、多语言支持、适合教学 | 大型项目性能不足,AI 上下文记忆有限 |
Lovable | 非技术用户模板工具 | 丰富模板库、快速构建 MVP(如投资组合跟踪工具) | 免费版仅支持公开项目,代码控制权低 |
三、适用场景与总结
-
Bolt.new 最佳场景:
- 快速生成全栈应用原型,尤其适合 React/Next.js 技术栈。
- 零基础用户通过自然语言实现“提示→生成→部署”全流程。
- 团队协作开发或教学演示(通过 URL 实时共享)。
-
竞争力总结:
Bolt.new 凭借 浏览器端全栈开发 和 AI 生成完整应用 的能力,成为轻量级项目的首选工具。其开源免费特性(GitHub 4.5K stars)进一步降低使用门槛。但对于复杂项目,仍需结合传统开发工具(如 VS Code)进行深度优化。
体验
金句卡片
开发 金句卡片 的体验还不错。描述需求,不仅可以用自然语言,也可以用截图。然后生成的代码也可以改,在改完后的代码上继续生成。遇到的不足:
- 垂直对齐搞不定。两个元素在同一行,但做不到垂直对齐。最后还是靠改代码实现的。
Zustand Demo
还行把。
记账软件
做个记账软件。要登录后才能用。单用户,通过 env 来配置账号和秘密。如果没配置账号秘密,默认为 joel/123456。
数据存 Supabase。 写数据总是不成功。
TODO
- 做一个关于设计原则/审美的演示站。
- 做一个每天抓一些感兴趣的内容的站?或其他 ai 的。