小白也能行!10分钟用Cursor搭建个人博客网站(零基础教程)
一、Cursor是什么?
Cursor是一款基于AI的智能代码编辑器,它整合了GPT-4技术,可以帮助我们:
自动生成代码
解释代码含义
修复代码错误
对话式编程指导
特别适合编程新手使用,传统搭建博客需要掌握的HTML/CSS/命令行等知识,现在通过Cursor的AI对话都能轻松搞定!
(对比传统VS Code的优势:内置AI助手/智能补全/对话式编程)
二、准备工作
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中执行如下命令,配置缓存目录和全局目录
#设置缓存npm config set cache
"E:\Program Files\nodejs\node_cache"
#设置全局模块
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
如果你想要更好的体检,可以看看以下建议:
- 绑定自定义域名(阿里云10元/年)
- 添加评论系统(Valine/Giscus)
- 配置SEO优化
- 接入Google Analytics
现在你已经拥有一个完全属于自己的博客网站了!整个过程无需编写任何复杂代码,通过Cursor的AI辅助和简单命令就能完成。赶快写你的第一篇博客吧!
小白也能行!10分钟用Cursor搭建个人博客网站(零基础教程)的更多相关文章
- 阿里云+wordpress搭建个人博客网站【小白专用的图文教程】
[声明] 欢迎转载,但请保留文章原始出处→_→ 生命壹号:http://www.cnblogs.com/smyhvae/ 文章来源:http://www.cnblogs.com/smyhvae/p/4 ...
- 阿里云+wordpress搭建个人博客网站
[正文] 在阿里云上搭建使用个人博客主要分为以下几个步骤: 1.购买阿里云ECS主机 2.购买域名 3.申请备案 4.环境配置 5.安装wordpress 6.域名解析 声明一下,本人对服务器端的知识 ...
- 从零到一快速搭建个人博客网站(域名自动跳转www,二级域名使用)(二)
前言 本篇文章是对上篇文章从零到一快速搭建个人博客网站(域名备案 + https免费证书)(一)的完善,比如域名自动跳转www.二级域名使用等. 域名自动跳转www 这里对上篇域名访问进行优化,首先支 ...
- 如何搭建个人博客网站(Mac)
一直以为自己记忆力很好,毕业之后才发现,之前需要看一遍就能记住的东西,现在看两三遍才能有印象.而搞技术的,如果不及时的记录下当时的情景,过后很容易就忘记.所以,再次萌生了搭博客.写文章的想法(之前用D ...
- Linux_基于Docker快速搭建个人博客网站
时间:2017年04月28日星期五 说明:基于docker技术,使用jpress开源框架搭建个人博客网站.特别感谢jpress开源项目.系统版本:CentOS 7.2-64bit. 步骤一:准备Doc ...
- Flask搭建个人博客网站(1)—项目规划--李渣渣(lizaza.cn)
Flask搭建个人博客网站(1)—项目规划--李渣渣(lizaza.cn) 发布时间:2020-05-2413次浏览 前言 现在市面上又许多比较成熟的博客平台,例如:CSDN,博客园,新浪博客等!对于 ...
- GitHub Pages + Hexo搭建个人博客网站-github风格-采坑记录
目录 1.本机安装nodejs 2.github上创建仓库 3.安装hexo 4.hexo主题 5.配置主题 6.添加文章 7.使用分类和标签 8.增加文章目录 9.推送github 使用github ...
- LNMP架构之搭建wordpress博客网站
系统环境版本 [root@db02 ~]# cat /etc/redhat-release CentOS release 6.9 (Final) [root@db02 ~]# uname -a Lin ...
- Hexo+Github/Coding免费搭建个人博客网站
体验更优排版请移步原文:http://blog.kwin.wang/other/hexo-github-build-blog.html 很早之前就想搭建一个属于自己的博客网站,一方面是给自己做笔记,把 ...
- 从零到一快速搭建个人博客网站(域名备案 + https免费证书)(一)
环境介绍 资源 说明 centos v7.2 docker 快速部署项目环境 nginx 反向代理,同时配置https证书 halo v1.4.2,开源博客项目 Let's Encrypt 免费证书 ...
随机推荐
- redis - [03] 配置&命令
题记部分 一.配置(Config) 二.命令(Command) (1)启动redis服务:redis-server.exe redis.windows.conf (2)连接redis-server:r ...
- Shell - shell中的运算符
基本语法 使用案例 基本语法 $((运算式)) $[ 运算式 ] 使用案例 # 第一种写法 a=10 b=20 c=`expr ${a} + ${b}` echo "$c" # 第 ...
- 【vulhub】redis 4-unacc (redis未授权访问)
渗透环境 攻击机: IP: 192.168.66.130(Kali) 漏洞收录于:vulhub/redis/4-unacc 涉及知识点:redis未授权访问 影响版本:redis 版本 < ...
- C/C++跨平台开发1-windows和linux中的类库
基本概念: 什么是库: 在windows平台和linux平台下都大量存在着库. 本质上来说库是一种可执行代码的二进制形式,可以被操作系统载入内存执行. 静态库:在程序链接的时候使用,链接器会将程序中使 ...
- 面试题 17.12. BiNode
地址:https://leetcode-cn.com/problems/binode-lcci/ <?php /** 二叉树数据结构TreeNode可用来表示单向链表(其中left置空,righ ...
- 花3分钟来了解一下Vue3中的插槽到底是什么玩意
前言 插槽看着是一个比较神秘的东西,特别是作用域插槽还能让我们在父组件里面直接访问子组件里面的数据,这让插槽变得更加神秘了.其实Vue3的插槽远比你想象的简单,这篇文章我们来揭开插槽的神秘面纱. 欧阳 ...
- 基于PHPstream扩展手动实现一个redis客户端
描述 redis是一个经典的key-value缓存数据库,采用C/S架构.当我们安装成功以后,你就知道它有个服务端,启动后默认监听6379端口,然后提供一个客户端工具redis-cli. 我们可以使用 ...
- C++基础学习--随记
博客地址:https://www.cnblogs.com/zylyehuo/ 参考"C++基础与深度解析" 一.预备知识 // c++常用工具 /usr/bin/time //查看 ...
- 找到占用磁盘最多的文件或目录,可以使用du和sort
想要找到占用磁盘最多的文件或目录,可以使用du和sort命令: du -h /path/to/directory | sort -rh | head -n 10 其中: du -h /path/t ...
- linux下expdp和impdp命令
一.查看管理理员目录(同时查看操作系统是否存在,因为Oracle并不关心该目录是否存在,如果不存在,则出错) >select * from dba_directories; 删除定义目录 > ...