手把手教你用Cursor开发个人博客网站,包含部署全流程

手把手教你用Cursor开发个人博客网站,包含部署全流程

对于刚接触Cursor的新手而言,最重要的是通过一个简单cursor 教程的项目练手,迅速掌握整个开发流程。只有熟悉了开发的基本步骤和常用工具的前提,才有可能更好地推进更复杂的开发任务。

本文将带你使用Cursor完成一个个人博客网站的开发,包含完整的编码过程以及最终的服务器部署上线操作。

准备阶段

  • 下载并安装GitHub Desktop,同时登录GitHub账号;
  • 利用GitHub Desktop创建一个新的仓库,选择本地存储路径以便后续使用;
  • 前往官网下载Cursor:Cursor官方下载页面;
  • 在Cursor中打开之前创建的仓库目录,并在根目录添加
    • .cursorrules文件,粘贴以下内容:

开发与测试

  • 在项目根目录下新建一个“个人介绍”文本文件,填写相关内容供后续使用;
  • 开启Cursor Agent模式,并切换模型为Claude 3.7;
  • 输入如下提示词来指导Cursor生成代码:
    • “你好,现在我想创建一个个人博客网站”
    • “网站的内容我希望是:有我的头像、简介、生活照片和社交媒体账号”
    • “@个人介绍”(拖入已写好的个人介绍文件)
  • 代码生成完成后,在Cursor中右键HTML文件,选择Open With Live Server查看页面效果;
  • 若图片未能显示,可将图片命名后置于项目目录内,并告诉Cursor具体的文件名和后缀。

部署上线

  • 注册并登录Vercel账户;
  • 上传本地代码至GitHub云端仓库;
  • 进入Vercel管理界面,选择你的GitHub项目并导入;
  • 点击Deploy进行自动部署;
  • 部署完成后,Vercel将提供免费域名用于访问你发布的网页。

本篇文章介绍了从零基础到完成一个小型项目的全过程,希望能帮助您更快上手Cursor编程环境,并逐步进阶。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:Ai探索者,转载请注明出处:https://javaforall.net/241263.html原文链接:https://javaforall.net

(0)
上一篇 2026年3月16日 上午7:31
下一篇 2026年3月16日 上午7:31


相关推荐

关注全栈程序员社区公众号