点击上方蓝字关注我们
从零到上线，手把手教你用 AI 工具打造专属技术博客！
最初学习编程时，许多人都有一个共同的梦想：打造一个属于自己的博客网站。
随着学习的深入会发现，实现这个目标需要掌握大量的技术栈，比如前端开发（HTML、CSS、JavaScript）、后端开发（Node.js、Python、PHP 等）、数据库管理（MySQL、MongoDB）、服务器部署（Nginx、Apache）等等。
面对如此多的技术点，最终感到无从下手，甚至在学习的过程中逐渐搁置了这个想法。
幸运的是，随着人工智能技术的快速发展，尤其是 AI 辅助编程工具的涌现，搭建一个个人博客网站变得前所未有的简单和高效。
如今，借助像 v0 和 Cursor 这样的工具，即使你没有深厚的编程基础，也能快速构建出一个功能完善、界面美观的博客网站。
什么是 v0 和 Cursor？
v0：v0 是一个基于 AI 的低代码开发平台，专为快速构建 Web 应用而设计。它通过可视化的界面和智能代码生成功能，帮助用户快速搭建前端页面和后端逻辑，极大地降低了开发门槛。
Cursor：Cursor 是一款智能代码编辑器，内置了强大的 AI 辅助编程功能。它能够根据你的需求自动生成代码、修复错误，并提供实时的编程建议，极大地提升了开发效率。
如何利用 v0 和 Cursor 快速搭建博客网站？
打开 v0 官网，在编辑框输入如下提示词。
你是一位资深的前端开发工程师，我现在需要开发个人知识博客网站，主要存放编程知识点，需要你帮我生成一个个人博客网页
# 技术
react vite Tailwind CSS shadcn
让 v0 先帮助我们生成框架及初版，点击右上角的 Codebase 可以下载到本地，这里有两个选择，一个复制，一个下载。
在本地新建一个目录 blog，并配置好。cursorrules 文件，指定一些前端开发基本的知识和注意事项。
在 Cursor 的左侧目录点击右键，选择在集成终端中打开
将复制的链接粘贴到终端，回车进行下载，下载完成后会让配置一些信息，稍微修改即可
一个链接好像只让下载一次，在下载时候就一直报错
下载完成后，输入 npm run dev 运行程序，报错如下，导入文件路径有问题，这是因为 curosr 不知道项目有哪些目录和分别存放的位置，
按住 Shift 键，选择左侧文件界面中的代码目录，直接拖到 compose 框，让 cursor 先阅读这个项目，理解项目的目录结构并进行更改。
修改完成后还有问题，让 cursor 根据报错继续修改
经过两次修改，项目就可以正常运行了，但目前只是一个最基础的界面，点击按钮还不能进行跳转。
接下来我们增加跳转功能
一步到位，点击阅读后，可以正常跳转了
但是我发现每个知识点的内容只是一个简单介绍，针对知识点内容过于简略的问题，探索了多种解决方案。
从传统的网络爬虫数据采集，到直接运用 AI 智能生成，最终发现后者才是符合 AI 时代特征的高效知识获取方式。这种技术路径的转变，才是智能化工具带来的生产力革新，提示词如下所示。
很好，现在可以了，我新创建了一个目录，@content 我希望将每个知识点的内容创建一个文本文档，
每个内容不少于300字，并且在程序启动时候加载这些内容，件名是知识点的内容，文件内容不要使用markdown，
我希望你能帮我编写这些知识点文档，文格式并修改对应的代码
生成内容后测试有一个 bug，同样将报错发给 Cursor 进行修改
修改了一次后，就可以正常展示本地文档的内容了
正常的项目开发过程中会使用 git 进行版本控制，这里为了后续的部署，我使用了 github，在 github 上新建 blog 项目
把 git 仓库给到 cursor，curosr 会帮我们生成 gitignore 文件和提交命令，gitignore 的作用是指定不提交哪些内容。
目前 github 需要进行密钥配置，按照 curosr 给的教程配置即可。
配置完成后，就可以正常提交了，刷新界面会显示我们提交的内容。
提交完成后，使用 vercel 部署：https://vercel.com/new。
这里 vercel 需要使用 github 登录，并进行绑定，可以参考如下文章。
https://blog.csdn.net/weixin\_52164430/article/details/143060297
登录并绑定成功后界面如图所示，点击 Import 导入项目
点击 Deploy 进行部署，Vercel 会自动执行
部署成功后会跳转到如下界面，红框内的链接就是可以正常访问的地址。
在浏览器输入地址后，就可以正常访问了
通过这个示例，我们可以看到，借助 AI 辅助编程工具如 v0 和 Cursor，搭建一个个人博客网站变得前所未有的简单和高效。即使没有深厚的编程基础，也能快速构建出一个功能完善、界面美观的博客网站。
AI 技术的快速发展正在彻底改变编程的方式。对于初学者来说，AI 工具是一个强大的学习助手，能够帮助快速上手并理解复杂的编程概念。对于有经验的开发者来说，AI 工具则是一个高效的协作伙伴，能够更快地实现创意和想法。
大家多多尝试和使用 AI 辅助编程工具。无论是初学者还是资深开发者，AI 都能为你带来全新的编程体验和效率提升。
AI编程交流群已经200人了，只能通过邀请进群了，欢迎大家进群交流学习，感兴趣的扫码添加好友邀你进群。