为什么不用 Cursor？
虽然 Cursor 是一个很强大的 AI 编程工具，但它更适合完整的开发环境。而当我们需要快速搭建一个网站原型时，可能需要：
这时，一个基于浏览器的全栈开发环境可能是更好的选择。
什么是Bolt.new
Bolt.new 是 StackBlitz 团队推出的一款革命性 AI 驱动的 Web 开发工具，它让你直接在浏览器中就能进行全栈开发，无需任何本地环境配置。
通过简单的自然语言对话，它能帮你完成从项目创建、依赖安装到部署上线的全过程，支持 React、Vue、Astro 等主流框架，还能运行 Node.js 服务器并处理 API 请求，是一个集开发、测试、部署于一体的 AI 辅助开发平台。
作为一个爱折腾的开发者，我第一时间体验了一下，没想到真的用它十分钟就搭建并上线了一个手机网站！今天就来分享下这个有趣的经历~
初遇 Bolt.new
说实话，一开始我也没抱太大期望。毕竟市面上 AI 工具那么多，真能有多神奇？但当我了解到它的特点后，确实被吸引了。
直接在浏览器里就能进行全栈开发
不用配置本地环境，还能用 AI 帮你写代码、装依赖、部署上线...
听起来是不是很心动？
Bolt.new 就是这样一个工具。它把 AI 能力和开发环境完美结合在一起，让你专注于创造，而不是被各种配置和环境问题困扰。
? 十分钟开发实录
好了，说说我的实际体验。打开 bolt.new 的那一刻，我就对着 AI 说：
"帮我创建一个基于 Astro 和 Vue 的移动端网站，用 Tailwind CSS 做样式"
就这么简单一句话，AI 就开始忙活起来了：创建项目、装依赖、配置环境...虽然等待的过程比本地开发慢了点，但胜在完全不用自己动手。
等环境准备好，我继续让 AI 帮我搭建基础布局：
<div class="w-full h-screen max-w-md mx-auto"><header class="sticky top-0 bg-white/80 backdrop-blur-sm"><nav class="flex justify-between items-center p-4"><h1 class="text-lg font-semibold">产品展示</h1><button class="p-2 hover:bg-gray-100 rounded-full"><span class="sr-only">菜单</span></button></nav>
</header>
<main class="p-4 space-y-6"><!-- 要放产品列表的地方 -->
</main></div>
看到这个基础框架，我心里有谱了。接下来就是添加实际内容，我让 AI 帮我设计了一个产品卡片组件：
function ProductCard({ product }) {return (<div class="bg-white/70 backdrop-blur-sm rounded-xl p-4"><div class="aspect-square rounded-lg overflow-hidden"><imgloading="lazy"src={product.image}alt={product.name}class="w-full h-full object-cover"/></div><div class="mt-3"><h3 class="font-medium">{product.name}</h3><p class="text-sm text-gray-600">{product.description}</p></div></div>
);
}部署
页面生成完成后,就可以直接部署了,点击右上角的 deploy
程序会自动生成构建过程
然后一个线上可访问的地址就这么生成好了:
在线预览地址:
https://cozy-bavarois-746d6a.netlify.app/
提示词
完成上面的内容,我把整套的提示词都整理好了,需要的朋友可以在后台回复关键词"blot"
提示词打磨了近半个小时600多字,扔进去就可以直接生成一个现代美观的网站 ,里面包含了丰富详细的设计规范和代码提示,很有参照价值
使用小贴士
不过实际使用中也有一些小技巧要注意。比如跟 AI 说话要具体一点，"做个好看的按钮"不如"做个带阴影和渐变的圆角按钮"。
还有就是性能优化别忘了，我习惯性地加了一些优化代码：
// 图片懒加载<img loading="lazy" />// 组件按需加载const LazyComponent = lazy(() => import('./Component'))最后的思考
Bolt.new 最适合什么场景？我觉得是那些需要快速验证想法的时候。比如：
想试试新学的框架？用它！
要做个演示 Demo？用它！
要快速搭建原型？用它！
但如果是复杂的业务项目，可能还是更适合传统开发方式。毕竟工具再好，也是辅助，不是万能的。
写在最后
技术在进步，工具在进化，但最重要的还是我们如何用好它们。Bolt.new 给了我们一个新的可能，让开发变得更轻松有趣。
期待未来会有更多这样的工具出现。毕竟谁不想又快又好地把想法变成现实呢？?
粤ICP备14082021号
免费POC，
零成本试错
