使用Hexo从0到1搭建个人博客详细教程(超详细,超简单)

简介: 使用Hexo从0到1搭建个人博客详细教程(超详细,超简单)
看完这篇,轻轻松松搭建个人博客,校花,班花,额,额

一,搭建前的软件准备(git,node)

搭建之前需要准备的软件:
Git:官网下载: https://git-scm.com/
Node.js 官网下载: http://nodejs.cn/

二, 安装hexo,完成简单本地页面展示

1.进入cmd窗口输入指令:

npm install -g hexo-cli

在这里插入图片描述

2.你可以先创建一个文件夹myblog,然后cd到这个文件夹下(或者在这个文件夹下直接右键git bash打开)。
在这里插入图片描述

接下来初始化一下hexo

hexo init

在这里插入图片描述

3.查看是否能启动成功

hexo s

在这里插入图片描述

新建完成后,指定文件夹目录下有:
node_modules: 依赖包
public:存放生成的页面
scaffolds:生成文章的一些模板
source:用来存放你的文章
themes:主题
_config.yml: 博客的配置文件

4.复制网址打开

http://localhost:4000/

在这里插入图片描述

这是初始界面,我们需要部署到github上。

ctrl+C可以停止;

三,将Hexo部署到Github

1.Github创建个人仓库

首先,需要有一个github账号。登上账号后建一个仓库:仓库名为你的用户名.github.io,
举例如下:
创建一个和你用户名相同的仓库,后面加.github.io,
只有这样,将来要部署到GitHub的时候,才会被识别,也就是xxxx.github.io,其中xxx就是你注册GitHub的用户名.

在这里插入图片描述

2.生成ssh添加到Github

在Github上创建仓库完成之后,需要设置ssh免密登录

1.打开cmd窗口:执行如下命令:

git config --global user.name "yourname"
git config --global user.email "youremail"

这里的yourname输入你的GitHub用户名,youremail输入你GitHub的邮箱。这样GitHub才能知道你是不是对应它的账户。用户名为仓库的名称,邮箱为注册github的邮箱,举例如下:

在这里插入图片描述

防止输错可以检查:

git config user.name
git config user.email

2.接着进入到家目录:C:\Users\libinbin,右击打开git bash 。
输入:

ssh-keygen -t rsa -C 2412757158@qq.com

后面是自己注册github的邮箱,然后敲三次回车,

在这里插入图片描述

3.接着就会发现C:\Users\libinbin下多了一个.ssh目录,打开后有一个公钥,一个私钥。id_rsa.pub是公钥,我们需要打开它,复制里面的内容。

然后进入github:

点击setings
在这里插入图片描述

进行以下操作

在这里插入图片描述
发现我们需要一个密钥,把我们刚刚复制的密钥粘进去,title随便起

在这里插入图片描述
点击 Add SSH Key

3.进行部署

这一步,我们就可以将hexo和GitHub关联起来,也就是将hexo生成的文章部署到GitHub上,打开站点配置文件 _config.yml,翻到最后,修改为
YourgithubName就是你的GitHub账户

1.修改配置文件
在这里插入图片描述

修改内容:

deploy:
  type: git
  repo: git@github.com:goubin18/goubin18.github.io.git
  branch: main

在这里插入图片描述

注意:后面有空格

repo:获取步骤如下

点进自己刚刚创建的仓库,复制

在这里插入图片描述

2.找到自己的博客路径打开

在这里插入图片描述

这个时候需要先安装deploy-git ,也就是部署的命令,这样你才能用命令部署到GitHub。

npm install hexo-deployer-git --save

在这里插入图片描述

2.然后依次执行以下命令:


hexo c   #清除缓存文件 db.json 和已生成的静态文件 public
hexo g       #生成网站静态文件到默认设置的 public 文件夹(hexo generate 的缩写)
hexo d       #自动生成网站静态文件,并部署到设定的仓库(hexo deploy 的缩写)

注意deploy时会让输个yes

最后回到github上查看自己的仓库:

在这里插入图片描述
这就表示上传成功。

现在就可以使用xxx.github.io来访问你的博客啦
例如:我的用户名是goubin18,那么我的博客地址就是goubin18.github.io

举例如下:

在这里插入图片描述

写在最后:

现在简单的博客已经搭建完成了
现在你的个人网站的地址是 xxx.github.io,如果觉得这个网址配不上帅气多金的你,你就可以设置个人域名了。但是需要花钱。
小提示:
操作要细心,如果出现了问题可以私信留言,大家一起想办法!

下期预告:设置主题

相关文章
|
存储 对象存储 CDN
Hexo从0到1搭建博客系列04:图床的最佳实践
Hexo从0到1搭建博客系列04:图床的最佳实践
992 0
|
安全 Ubuntu Unix
/var/log/syslog日志说明
`/var/log/syslog`是Unix和Linux的日志文件,记录系统事件和消息,由`syslogd`或`rsyslogd`生成。日志条目含时间戳、主机名、PID、日志级别(如DEBUG、ERROR)和事件描述。内容涵盖系统启动/关闭、硬件错误、网络、用户登录、安全事件等。查看日志可使用`cat`、`tail`、`less`或`grep`命令。不过,不同Linux发行版可能有变,如Ubuntu使用`journald`和`journalctl`。
1890 3
|
前端开发 Serverless 云栖大会
|
算法 机器人 定位技术
【机器人路径规划】基于流场寻路算法(Flow Field Pathfinding)的机器人路径规划(Python代码实现)
【机器人路径规划】基于流场寻路算法(Flow Field Pathfinding)的机器人路径规划(Python代码实现)
635 4
|
IDE Linux 开发工具
2022.2最新idea破解,window,mac通用
1、安装IDEA,一路next即可,遇到安装路径时,记得修改安装路径。 2、安装完成,打开IDEA,会先弹出一个注册框,勾选Evaluate for free,点击Evaluate,然后进入主界面 3. 开始破解
17195 0
2022.2最新idea破解,window,mac通用
|
机器学习/深度学习 缓存 Shell
VSCode上的Git使用手记(持续更新ing...)
本笔记是我想要学习如何将本地文件发布到GitHub上时开始看廖雪峰的Git教程,然后打开了VSCode,发现VSCode上面集成的Git辅助使用功能真的很好用…… 基本上到了不用看教程都可以猜懂的地步。 为了整理、规范使用技巧,在经过了一番学习和试验之后,觉得以这样一篇使用手记的形式发布使用技巧相关的博文,以记录和沉淀经验,并帮助更多Git和VSCode初学者少踩坑。 本文参考的教程、文档等内容见本文末尾。
VSCode上的Git使用手记(持续更新ing...)
|
Web App开发 iOS开发
为 iPhone 和 iPad 自定义网站的主屏幕图标
iPhone 和 iPad 等苹果设备使用主屏幕 (Home Screen, 也称桌面) 管理应用程序, 还可以通过浏览器的添加到主屏幕功能将网站链接作为快捷方式添加为主屏幕图标. 是否你也想过为网站定义一个图标, 如果用户将网站添加至主屏幕, 网站链接看起来更像原生程序, 也能获得更多的关注.
2271 0
|
消息中间件 数据可视化 Java
Kafka集群搭建可视化指南
Kafka集群搭建可视化指南
593 0
|
弹性计算 关系型数据库 Apache
手把手教你使用阿里云服务器搭建个人博客
这是我第一次搭建个人博客网站,总体上来说还是非常顺利的,主要四个步骤,首先创建阿里云服务器,其次创建云数据库实例,再次阿里云服务器链接云数据库,最后安装WordPress。四步轻松就可以搭建个人博客网站啦,之前搭建博客起码需要一两周的时间,这次建站只花费了我1个小时就完成啦。
4993 12