小白也能行!10分钟用Cursor搭建个人博客网站(零基础教程)

全网最全面详细的Cursor使用教程,一篇就够了,让开发变成聊天一样容易 阅读详情

一、Cursor是什么?

Cursor是一款基于AI的智能代码编辑器,它整合了GPT-4技术,可以帮助我们:
✅ 自动生成代码
✅ 解释代码含义
✅ 修复代码错误
✅ 对话式编程指导
特别适合编程新手使用,传统搭建博客需要掌握的HTML/CSS/命令行等知识,现在通过Cursor的AI对话都能轻松搞定!

(对比传统VS Code的优势:内置AI助手/智能补全/对话式编程)

二、准备工作(2分钟)

1、下载安装Cursor:官网 https://cursor.sh(支持Win/Mac)

2.安装Node.js:官网 https://nodejs.org(选LTS版本,安装时记得勾选Add to PATH)

2.1、下载nodejs

​

2.2、安装nodejs

2.2.1 自定义安装路径(可以选择默认)

​

2.2.2 图根据本身的需要进行,我选择了默认Node.js runtime,然后Next:

Node.js runtime :表示运行环境

npm package manager:表示npm包管理器

online documentation shortcuts :在线文档快捷方式

Add to PATH:添加到环境变量

​

不用勾选这一个,继续Next,然后自定义安装路径,这里建议不要装在C盘,直接把C:\Program Files\nodejs改成D:\Program Files\nodejs

然后再在安装路径的根目录下新建两个文件夹,node_cache和node_global,如图所示:

​

2.2.3 环境配置

建好以后开始配置环境:右键此电脑——属性——高级系统设置——高级——环境变量

​

​

在系统变量里新建一个NODE_HOME,变量值为安装路径:D:\Program Files\nodejs

​

然后再在系统变量的【path】中添加

%NODE_HOME%

%NODE_HOME%\node_global

%NODE_HOME%\node_cache

​

然后将用户变量默认的C:\User\lenovo\AppDate\Roaming\npm改成: D:\Program Files\nodejs\node_global

​

到这一步,环境就已经完全配好了,现在开始查看。

2.2.4 查看

键盘Win+R进入cmd,然后依次输入

【注意:此时是打开CMD窗口,并非在C:\Program Files\nodejs目录下执行node.exe】

node -v

npm -v

​

像这样会出现你安装的版本号

默认状况下,我们在执行npm install -g XXXX时,下载了一个全局包,这个包的默认存放路径C:\Users\Administrator\AppData\Roaming\npm\node_modules下,能够经过CMD指令npm root -g查看

然后在cmd中执行如下命令,配置缓存目录和全局目录

  1. #设置缓存npm config set cache
  2. "E:\Program Files\nodejs\node_cache"
  3. #设置全局模块
  4. npm config set prefix "E:\Program Files\nodejs\node_global"

​

​

如果出现标红报错,是由于权限的原因,右击Nodejs文件夹->属性->安全,点击编辑,将所有权限都 ✔即可。

或者以 管理员身份运行 cmd。

5.更换npm源为淘宝镜像

npm 默认的  registry ,也就是下载 npm 包时是从国外的服务器下载,国内很慢,一般都会指向淘宝 https://registry.npm.taobao.org。

在cmd里输入npm config set registry https://registry.npm.taobao.org/

检查配置是否成功  

npm config get registry

​

这样就配置好了

配置完成后,安装个module测试下,输入npm install express -g,进行模块的全局安装:

由于版本的问题,淘宝的镜像已经过时了,解决办法:

先输入pm config set strict-ssl false

最后:npm install cnpm@7.1.1 -g

至此,nodejs就安装好了。

3、注册GitHub账号:https://github.com(用于免费部署)

​

三、搭建博客详细步骤

1、打开cursor客户端软件

​

2、创建项目

在Cursor中按 Ctrl+N 新建终端,依次输入:

mkdir myblog   # 创建博客文件夹

cd myblog      # 进入文件夹

npm install -g hexo-cli  # 安装Hexo框架

hexo init      # 初始化博客

npm install    # 安装依赖

3、启动本地服务器

继续输入:

hexo clean; hexo g; hexo s

注意:需要在当前根目录myblog下

浏览器打开 http://localhost:4000 就能看到初始博客啦!

​

4、自定义博客(Cursor AI辅助)

4.1、修改配置:用Cursor打开 _config.yml 文件

  • 修改title/description等基本信息
  • 按Ctrl+K唤出AI,输入"如何更换博客主题?"

​

4.2、安装主题示例:

npm install hexo-theme-butterfly

在配置文件中修改:

theme: butterfly

​

5、部署到GitHub Pages

5.1、在GitHub新建仓库,名称为【你的用户名.github.io】

5.2、安装部署插件:

npm install hexo-deployer-git –save

5.3、修改配置:

deploy:

  type: git

  repo: https://github.com/你的用户名/你的用户名.github.io.git

  branch: main

5.4、执行部署:

hexo clean ; hexo deploy

四、效果展示

访问 https://你的用户名.github.io 就能看到线上博客啦!

​

默认包含:

  • 文章发布功能
  • 分类/标签系统
  • 响应式设计
  • 主题自定义界面

五、温馨提示

✨ 所有操作都可在Cursor终端完成
✨ 遇到问题随时按 Ctrl+L 唤醒AI助手
✨ 推荐免费主题:Butterfly/Volantis/Material
✨ 修改配置后记得先hexo clean

如果你想要更好的体检,可以看看以下建议:

  1. 绑定自定义域名(阿里云10元/年)
  2. 添加评论系统(Valine/Giscus)
  3. 配置SEO优化
  4. 接入Google Analytics

现在你已经拥有一个完全属于自己的博客网站了!整个过程无需编写任何复杂代码,通过Cursor的AI辅助和简单命令就能完成。赶快写你的第一篇博客吧!

Cursor从入门到上手 通过以上步骤,你会发现使用 Cursor 的整个过程非常流畅,我们只需要提供准确的提示词,Cursor 就能够根据我们的需求,生成出我们想要的效果。无论是开发项目,还是探索新的编程玩法,Cursor 都是一个很好的开发工具,大家可以根据自己的实际需求,进一步挖掘 Cursor 的潜力,创造出更多有趣的作品。输入提示词:向 Cursor 提供一个简单的提示词,比如“创建一个飞机大战游戏的基本框架”,Cursor 会根据你的提示开始生成代码。再次查看效果:修改完成后,再次查看游戏效果,直到你满意为止。 阅读详情

相关推荐

使用Cursor 5分钟完成一个专业网站首页

用cursor 5分钟完成一个专业网页制作,支持自适应、支持手机H5、支持中英文,甚至文案都写地非常好。本来想计划做一个小页美的景点网站,产品还是思考设计中,域名备案就已经申请下来了,那就先挂个首页内容吧。原先是想手撸几行HTML代码,放个站点名再加几个“正在路上”的文案,又感觉太Low了,这么正好赶上有Cursor么,让它写个放上来应该很省事。想要了解怎么使用cusor,可以看我收集的这里内容《》,内容精简,也就几篇功能介绍、使用技巧,以及如何免费使用。

wjhqqweqwe的博客 1783

【一个好用的智能编辑器】用于写代码很智能。Cursor代码编辑器。Cursor官网地址。

你还在寻找一个智能的代码工具吗?智能编辑器Cursor是个不错的选择。

qq_42944545的博客 2万+

1小时搞定SVG转换网站!AI编程工具Cursor的神操作,效率狂飙!

🚀宝子们,我刚用AI编程工具Cursor,1小时就搞定一个SVG格式转换网站!高清SVG转PNG,动态SVG转GIF,全在浏览器搞定,隐私超安全。效率狂飙,太震撼啦!

Happiness is everywhere 1490

Cursor使用

Cursor是一款AI 代码编辑器,官网地址为https://www.cursor.com/,直接在官网下载安装即可,基于VS Code二次开发而来,之所以没有采用插件方式,在官方网站上给出的答案是某些功能插件无法实现,产品专注在使用AI来进行编程方面,价格方面还不便宜,Pro单月20刀,企业版单月单个用户40刀,但某些功能确实好用啊,有找外包替你完成部分工作的感觉,不付费的话使用次数有限制。Cursor会对代码进行索引,会计算代码库中的每个文件的嵌入向量,并将使用这些嵌入向量来提高代码库答案的准确性。

7万+

Cursor + 阿里云OSS:30分钟打造可外网访问的极简个人网站

本文详细介绍了如何利用Cursor和阿里云OSS在30分钟内快速搭建可外网访问的个人网站。通过AI编程工具Cursor生成代码,结合阿里云OSS的存储和部署能力,无需服务器运维即可实现高效建站,特别适合产品经理、设计师和编程新手。文章还提供了从环境配置到代码优化、部署上线的完整指南,帮助用户轻松打造专业级个人网站。

weixin_29230059的博客 304

Cursor使用教程

全面详细的cursor使用教程!

CamilleZJ的博客 5万+

cursor | 30分钟做一个个人网站(可供外网访问~)

网站是可以正常访问滴,就是页面还是比较粗糙的,如果想美化或者进行后台管理的话还是更推荐采取 hexo+github+netlify+cloudflare 来搭建个人网站叭🤔

No Game No Life 3969

cesium 高程数据使用

cesium 高程数据使用高程数据下载高程数据切片简单数据服务 高程数据下载 使用地理空间数据云平台免费提供的高程数据。地理空间云平台 点击列表中的下载得到数据压缩包。例如:ASTGTM2_N22E114.zip 高程数据切片 使用cesium实验室工具对下载得到的压缩包进行切片。cesium实验室 切片得到的文件夹目录。 简单数据服务 使用nodejs的koa启动简单的资源服务。koajs 项目根目录新建data文件夹,在新建dem文件夹放高程数据。 注意目录自行更换,这里是./data/dem

哎哟这个凉白白的博客 1811

10分钟用Cursor快速搭建电商网站原型

我选择的是Web应用模板,这样基础的文件结构就自动生成了。Cursor最棒的地方在于它能根据你的需求描述智能生成代码框架,省去了手动创建文件的繁琐步骤。作为一个经常需要验证产品想法的开发者,我发现这种快速原型开发方式真的能极大提升工作效率。整个过程最让我惊讶的是,Cursor不仅能生成代码,还能理解电商场景的特殊需求。它的一键部署功能让我刚写完代码就能立即分享给团队成员查看效果,省去了配置环境的麻烦。在Cursor中输入"生成电商商品列表页HTML",它立即给出了一个响应式布局的代码框架。

ObsidianRaven13的博客 948

水下探测小白必看:单波束vs多波束声呐,5分钟搞懂核心区别

本文为水下探测新手清晰解析了单波束与多波束声呐的核心区别。单波束声呐如同精准的“手电筒”,进行逐点扫描,适用于定点测深和目标探测;而多波束声呐则像“聚光灯”,能一次性覆盖一个扇区,高效获取海底地形三维信息,是海底测绘和水下三维建模的理想选择。文章通过生动的比喻和对比表格,帮助读者快速理解两者原理、效率差异及适用场景。

linux6sysadmin的博客 1047

Win10下ISE14.7 iMPACT闪退?三步搞定DLL替换(附详细路径)

本文详细介绍了在Windows 10系统下解决Xilinx ISE14.7 iMPACT工具闪退问题的三步DLL替换方案。通过替换关键DLL文件,有效解决了FPGA开发中的兼容性问题,帮助开发者快速恢复工作流程。

weixin_29290259的博客 583

零基础用Cursor快速搭建网站:实测1小时完成

摘要:本文介绍如何利用Cursor编辑器,在1小时内零基础搭建个人网站。通过自然语言描述需求,自动生成HTML、CSS和JavaScript代码,完成包含导航、作品展示和联系表单的摄影网站。文章详细分解了准备、内容填充、调试优化和上线四个步骤,并提供实用建议:具体描述需求、分阶段实施、善用提问功能。最终网站支持响应式设计和图片懒加载,可免费部署到GitHub Pages。该方法无需编程基础,适合快速创建各类功能性网站。(149字)

霍格沃兹测试学院的博客 442

DDR核心机制解析:从Burst到Prefetch的性能跃迁

本文深入解析了DDR内存性能跃迁的核心机制,重点阐述了Burst(突发传输)与Prefetch(预取)技术的协同工作原理。Burst机制通过连续传输数据减少访问延迟,而Prefetch则通过内部预取数据提升吞吐量,两者结合完美匹配现代CPU缓存行需求,是DDR3等内存实现高效带宽的关键。

weixin_29232121的博客 135

零基础教程:5分钟学会查CURSOR剩余额度

作为一个刚接触CURSOR的新手,我也曾对这个功能一头雾水,但经过一番摸索,发现其实特别简单。如果你也是刚接触CURSOR,不妨按照这个教程试试看,相信很快就能掌握这个实用技能。在CURSOR的控制面板中,找到"额度查询"或类似名称的选项。输入你的API密钥,系统就会立即返回当前的剩余额度信息。这里会显示你的专属密钥,它是查询额度的关键。系统通常会提供"生成新密钥"的按钮,点击后记得复制保存好这个密钥,因为它只会显示一次。它的界面非常直观,不需要复杂的配置就能快速看到效果,特别适合新手学习使用。

GoldenleafLynx28的博客 1527

【STABLE_BASELINE3】强化学习算法实战:模型的保存,读取,再训练

STABLE-BASELINE3,模型读取,再训练:有时候需要在已经训练好的模型基础上进行再次训练。

Kiek17的博客 4867

MC_SetOverride指令详细应用介绍(基恩士PLC)

基恩士KV系列PLC和松下总线绝对值伺服运动控制(详细配置+轴控完整ST源代码)

RXXW_Dor的博客 335

零手写代码!用Cursor 10分钟搭建完整Todo待办网站(SpringBoot+Vue3全流程

摘要:本文演示了如何利用Cursor的AI代码生成功能,10分钟内零编码搭建完整的Todo待办网站。采用SpringBoot3+Vue3+MySQL技术栈,全程只需三步:创建空文件、输入提示词、执行命令。后端自动生成10个核心文件,前端生成5个关键文件,包括页面组件和接口调用逻辑。通过双重跨域配置确保前后端联调,最终实现待办事项的增删改查功能。该方法显著提升开发效率,特别适合新手快速构建项目原型,将开发者从重复编码中解放出来,专注于业务逻辑设计。(149字)

2401_82753448的博客 925

VTK API 详解(103):vtkGPUVolumeRayCastMapper - GPU加速体绘制

是 VTK 中基于 GPU 的高效体绘制映射器,利用现代显卡的计算能力,通过射线投射算法实现快速且高质量的三维体积渲染。相比 CPU 版本的,GPU 映射器性能大幅提升,支持更复杂的光照和渲染效果,是体绘制的主流选择。是 VTK 中性能优异的GPU体绘制映射器;适合大数据集和实时交互应用;配合灵活设置颜色、透明度和光照;建议在支持OpenGL的环境中使用。

yumeiguo的博客 295

零基础!用 Cursor 10 分钟打造你的账号密码管理神器

近年来,随着 AI 技术的飞速发展,AI 编程工具日益成熟,想要自己开发一个工具软件变得十分简单。

pythonhy的博客 1605

基于ESP32的室内空气质量检测系统开发

随着环境污染问题的日益严重,室内空气质量的监测变得越来越重要。室内空气质量的好坏直接影响到人们的健康,尤其是对于在封闭空间长时间待着的人群。为此,基于ESP32的室内空气质量检测系统应运而生。ESP32作为一款集成了Wi-Fi和蓝牙的高性能微控制器,为嵌入式开发提供了良好的平台,适用于构建各种智能硬件设备。本博客将详细介绍如何基于ESP32开发一个室内空气质量检测系统。系统可以实时监测空气中的温度、湿度、二氧化碳浓度、甲醛浓度等指标,并通过Wi-Fi将数据传输到云端或移动设备,方便用户随时查看空气质量情况。

2201_76125393的博客 832

复分析 阿尔福斯(Ahlfors) 第三版答案 英文

答案分为十章,有部分习题没有答案,全英文复分析阿尔福斯(Ahlfors) 第三版答案

零基础快速搭建网站:Cursor 1小时建站实录

本文分享了如何使用Cursor编辑器在一小时内零代码搭建个人网站。通过自然语言描述需求,逐步生成HTML、CSS和JavaScript文件,实现了包含导航、作品展示和联系表单的摄影网站。文章详细介绍了从结构设计、内容填充到移动端适配的完整流程,并提供了免费部署建议,展示了AI辅助工具如何让网站创建变得简单高效。

dingding6772的博客 334

TMS_WebGMaps_1.9.8.0_Full_Source

TMS_WebGMaps_1.9.8.0_Full_Source 全源码 delphi cbuilder

【AI编程实战】零基础用ChatGPT+Cursor开发完整Web应用:30分钟从idea到上线

本文教你如何零基础使用ChatGPT和Cursor等AI工具快速开发完整Web应用。通过30分钟完成Todo应用案例,展示AI编程的高效优势:ChatGPT规划项目架构,Cursor自动生成代码,GitHub Copilot提升效率20倍。文章对比三大AI助手特点,提供详细开发步骤(环境搭建、前后端开发、数据库设计、部署上线)和避坑指南,适合编程新手、产品经理等非技术人员快速实现创意。案例证明AI让学习效率提升10倍,让开发周期从传统6-12个月缩短至1-2周,使"零代码基础开发"成为可

2302_80663569的博客 1695

lwip-2.0.3

lwip是瑞典计算机科学院(SICS)的Adam Dunkels 开发的一个小型开源的TCP/IP协议栈。实现的重点是在保持TCP协议主要功能的基础上减少对RAM 的占用。

假人有限元模型

假人模型,车辆碰撞假人有限元模型,适合做乘员安全的研究者利用

Cursor + TaoToken:30分钟搭建可外网访问的个人网站(含配置骨架)

用 Cursor 生成个人网站后卡在外网访问?本文给出可复制的 settings.json 与 config.toml 骨架,接入 TaoToken 统一 API 通道,30 分钟跑通部署与连通性验证。官网 https://taotoken.net/?utm_source=taotoken_aicg_blog_end 提供统一 Key,前端只调后端转发,避免 Key 泄露,并附 401、404、超时、跨域排查清单。

weixin_42605397的博客 196

MCP 太神了!5 分钟做一个播报每日热点的网站。

我这里使用了 Cursor,下面的步骤是使用 Mac 中在 Cursor 中配置这个 MiniMax MCP Server的步骤:打开 Cursor,创建一个项目后,点击右上角的设置,然后找到 MCP,添加一个 MCP 服务。MiniMax 的 MCP Server 支持两种生成音频的方式,克隆你的音色 & 指定某种音色让它生成,可以根据你的需求来决定使用哪种。API_KEY 就是你刚刚注册获取的 Key,MCP_BASE_PATH 就是配置一个方生成文件的地址,不过默认返回给你的是一个 url。

公众号:逛逛GitHub 1570
上一篇: Humanizer:让.NET数据处理更人性化的利器
下一篇: Hexo-butterfly 接入腾讯混元大模型自动生成文章摘要(保姆教程)
码农刚子.
博客等级 码龄8年 554粉丝 126原创
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

码农刚子.

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值