什么是Hexo

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页

本教程在Mac电脑上操作

准备搭建环境

选择适合当前你电脑系统的安装包安装及可，安装完之后可以用命令行查阅是否安装成功，有版本号显示，就代表是安装成功。

image-20201127101041474

安装 Git

image-20201127101249367

也是跟上述安装Node.js类似，然后在通过命令行工具查阅是否安装成功，有版本号，即表示安装成功。

image-20201127101630418

创建GitHub账号

GitHub 是一个面向开源及私有软件项目的托管平台

注册号账号后需要在GitHub里面创建一个仓库

image-20201127101941844

image-20201127102111807

配置GitHub的SSH

注册好了GitHub账号之后，就可以配置SSH秘钥了

第一步：

创建SSH Key，以Mac 为例，在用户的目录下，看看是否有.ssh目录，如果有，再看看这个目录下是否有id_rar 和id_rsa.pub这两个文件，如果有的话， 就直接跳转到下一步操作即可；如果没有，需要在命令行操作一下命令创建SSH Key

1
ssh-keygen -t rsa -C "youemail@xxxx.com"

你需要吧邮件地址换成你注册GitHub的邮箱地址，然后一路回车即可，使用默认的配置。

如果一切顺利，可以在用户的目录找到.ssh目录，里面就有id_rsa 和 id_rsa.pub 这两个文件，这两个就是SSH Key 的秘钥对，id_rsa是私钥不能泄露出去，id_rsa.pub是公钥

第二步:

在GitHub的用户页面，选择Settings.

image-20201127102232299

在左边栏选择SSH And GPG Keys -> New SSH Key
image-20201127215138408

第三步：

打开命令行输入命令测试是否配置成功

1
ssh -T git@github.com

如果提示Are you sure you want to continue connecting(yes / no ) ? 输入 yes 然后看到：

1
Hi {you name}! You've successfully authenticated, but GitHub does not provide shell access.

看到这个信息说明SSH已经配置成功，至此你还需要配置：

1
2
$ git config --global user.name "you name"// 你的github用户名，非昵称
$ git config --global user.email  "you github email"// 填写你的github注册邮箱

开始搭建博客

初始化

在电脑目录新建一个文件夹

1
2
3
4
5
6
7
8
mkdir hexo
npm install hexo -g
hexo init

然后再输入
hexo g # 生成本地文件
hexo s # 启动服务

hexo s 是开启本地预览服务，打开浏览器访问：http://localhost:4000/ 即可看到内容，如果打开浏览器一直在转圈就是加载不出来的问题，一般情况下是因为端口占用的缘故。

第一次初始化的时候 hexo 已经帮我们写了一篇 Hello World的文章，打开后就是这个样子的

hexo init

上传代码到GitHub

如果你的博客和 SSH 都配置好了，那么就可以发布到GitHub了，只需要命令行进入到当前初始化的文件夹中

输入命令 即可。

还有一部分配置需要知道，在初始化博客的文件夹中，找到_config.yml文件 修改里面的配置：

1
2
3
4
5
deploy:
  type: git
  repo: https://github.com/zouzhigang/zouzhigang.github.io
  branch: master

配置完之后还需要安装一个插件：

1
2
3
4
5
deploy:
  type: git
  repo: https://github.com/zouzhigang/zouzhigang.github.io
  branch: master

在当前初始化博客的文件中，打开命令行，输入hexo d 就会将本次有改动的代码全部提交 。

至此搭建就完成了。

如何新建一遍博客

在hexo 博客的根目录，用命令行执行如下代码：

1
hexo new post '你的博客的文章名字'

hexo 会自动帮我们在/source/_posts/生成一个以md结尾的文件。这个就是以markdown格式的文件。
然后就可以开始编写博客了。

hexo 常用命令：

1
2
3
4
5
6
7
hexo clean # 清除缓存，网页正常情况下可以忽视
hexo n "博客的名字" # hexo new "博客的名字" = 新建文章
hexo g   # hexo generate      :生成；
hexo s   # hexo serve   :启动服务预览；
hexo d  # hexo deploy   :部署；
hexo g -d   # :作用同 分别执行   hexo generate  ;      hexo deploy
hexo d -g   # :同上hexo generate --deploy

补充：

markdown格式编译器
推荐工具：Typora
官方地址：https://www.typora.io/
推荐理由：作为一款免费编辑器，可以说是相当的良心，是我目前所知道的最好用的免费编辑器了，没有之一！！！它支持多个主流的操作系统，不论你是Windows用户还是Mac用户，都能轻易的安装和使用它！除此之外，它还有多种不同的主题选择、导出一些常用格式（PDF、Word、HTML）等等非常有用的功能！

Markdown表格生成器
对于强迫症来说，写Markdown表格是一件很痛苦的事情，在语法对齐的问题上我真的是受尽了折磨，所以强烈推荐一个在线Markdown表格生成工具，它除了能快速生成格式化后的Markdown表格外，还支持导入各种数据，在线编辑，简直强大！

推荐工具：Table Convert Online
官方地址：https://tableconvert.com/
推荐理由：作为一款免费在线工具，支持Excel、JSON、HTML、CSV甚至是从URL中提取HTML表格转为Markdown表格，多功能集一身，并且融合在一个界面，使用非常方便，不需要切换页面。还可以像编辑Excel一样编辑生成各种表格，不愧为表格中的瑞士军刀！

画图工具
对于我们这些写技术文章的博主来说，画画流程图、架构图是辅助描述文章内容的最佳途径，下面要推荐的ProcessOn就是目前我用得最多的画图工具。

推荐工具：ProcessOn
官方地址：https://processon.com/
推荐理由：难得的国产在线图片编辑器，支持多人协作。同时，还有大量好看的图标支持，可以让我们的绘图更加生动！

图片存储
可能有人会问，为什么要图片存储呢？我们直接存Wordpress或者Hexo的目录下不就好了吗？实际上，使用这些主要是为了经济性的考虑，随着访问量的增大，图片对于我们的虚拟主机或ECS的空间以及带宽消耗都会造成一定的压力，使用类似图床的平台可以帮我们减轻这些压力。

推荐工具：外链工厂
官方地址：https://www.wailian.work/
推荐理由：简单好用、足够稳定，释放自己虚拟空间或虚拟主机的存储和带宽消耗，但是记得做好备份哦！

代码高亮
如果你跟我一样是一名程序猿，那么代码高亮是必备的。大多Hexo的主题中都包含了高亮插件，但是有些并没有，那么我们需要知道鼎鼎大名的hightlight.js。对于一些已经有这个插件的主题，也可以通过官网来做一些定制，没有的直接引入来使用即可。

推荐工具：hightlight.js
官方地址：https://highlightjs.org/
推荐理由：适用于所有主流编程语言，兼容性好，多种多样的预设样式，总有一款适合你！