简言
Hexo是一个极速、简单且强大的静态博客架构。它使用 Node.js作为构建引擎，上百个文件在几秒钟内便可构建完成；而且拥有着丰富的插件库，因开源而显得生机勃勃，可扩展性很好；最重要的，它支持 Markdown 作为书写语言，极大地方便了博客的撰写。
注意要规划好安装的目录，最好专门新建一个大的文件夹存放此次实践，这也是一个好的习惯！！
先展示一下效果图
安装环境
首先，我们需要现安装一些软件来搭建博客环境。
Node.js
Node.js官网下载地址，安装过程没什么可说的，一直点下一步即可。
安装完成了！
Git
Git官网下载地址，安装过程也是没有多少需要注意的，我们一路Next即可
安装完成了！
Notepad++
Notepad++官网下载地址，这个跟前两个一样也是一路next，没有什么需要注意的，这里就不做讲解了。
VScode（与Notepad++二选一）
VScode官网下载地址
Hexo
1.创建博客安装路径，在此路径右击找到GitBash,例如我们的目录为
D:\Myblog\Blog，右击Git Bash Here
2.打开Git Bash以后输入npm install -g hexo-cli安装Hexo，
安装好以后不要关闭Git Bash，接下来还要用。
注：
如果安装过慢导致失败，可以更换淘宝的 npm 源，命令如下：
npm config set registry https://registry.npm.taobao.org
验证是否设置成功：
npm config get registry
如果返回如下结果则设置成功：
资源准备
注册GitHub
1.浏览器访问GitHub官方网站
进入官网页面之后，依次填写完成用户名、邮箱和密码信息后点击Sign up for Github。
注意Username、Email和Pssword一定要记住，后边要多次使用，如果太长比较难记，建议记在记事本上。
2.注册完登录之后，先选中Unlimited public repositories for free(默认是选中的)，再点击Continue即可。
接下来，直接点击skip this step
3.然后如下图所示，先点击头像右边向下的小箭头，再选择Your profile。
然后先点击右上角的“+”，再点击New repository。
这时会验证你的邮箱，将收到的6位码填入，邮箱通过验证之后，这里需要就要输入新建仓库的信息
这里我们输入仓库名，它的写法是这样的,可不要任性去随意定义，就是username.github.io。这里我可吃了亏，否则是会失败的。其他的内容不需要操作，默认的public即可。
例如：
username:WangGang-a1
对应的仓库名就是:WangGang-a1.github.io
恭喜！您注册完成并创建了GitHub个人博客的仓库。
关于Github的使用在这里咱们详细讲解了，如果有想要了解的可以自行百度相关教程
注册Coding
为什么使用coding而不使用码云（gitee）呢?因为码云的的自定义域名要钱啊，身为学生的我还是退而求其次的选择了coding，而且现在coding对个人博客还是很友好的。
1.浏览器访问Coding官方网站
进入官网页面之后，我们点击登陆，使用微信登陆即可，跟腾讯云账号是有链接的。
2.建立仓库
依次点击项目，创建项目，选择代码托管项目
注意： 项目名称与你的用户名相同而且项目需要选择开源（公开），不能建立私人仓库。
环境搭建
Git配置SSH
1.安装完Git之后，我们需要使用SSH将本地Git项目与远程的GitHub建立联系。
Git安装之后会生成两个版本（Git Bash和Git Bash），我们使用的是Git Bash
点击Git Bash，依次输入以下代码：
git config --global user.name "Your Username" #Your Username为你的用户名(Github)
git config --global user.email "Your Email Address" #Your Email Address为你的邮箱地址(Github)
注意这里Your Username和Your Email Address必须正确。因为使用仓库前，要通过这两项标明自己的身份。
2.继续输入以下命令：
cd ~/.ssh
ssh-keygen -t rsa -C "Your Email Address"
输入cd ~/.ssh后，提示：No such file or directory， 说明第一次使用Git，对结果无影响。
代码说明：
cd ~/.ssh用来检查本机的ssh密钥，ssh-keygen -t rsa -C “Your Email Address”用于生成新的SSH Key。
执行命令之后，会出现下面内容：
Generating public/private rsa key pair.
Enter file in which to save the key (/Users/your_user_directory/.ssh/id_rsa):
出现该结果直接回车（也可以自定义key名称，一般默认就好）
会出现输入密码
Enter passphrase (empty for no passphrase):【输入加密串】【加密串我们看不见，你直接输入就好，输完密码回车键确定】
Enter same passphrase again:【再次输入加密串】
如果密码输入不一致，会提示再次输入：
Passphrases do not match. Try again.
这个密码会在你提交项目时使用，如果为空的话提交项目时则不用输入。
如果出现下图的界面，就说明key生成成功。同时从Your public key has been saved in /c/Users/User/.ssh/id_rsa.pub.能看到ssh key保存的位置。
添加 SSH Key 到 GitHub
1.回到Github，按照顺序点击右上角的头像-Settings-SSH and GPG keys -New SSH key
2.然后使用Notepad++打开本地id_rsa.pub（你的key名称）文件（ssh key文件）。如果看不到这个文件，则没有开启查看隐藏文件权限。将id_rsa.pub（SSH key文件）里面的内容全选复制粘贴到刚刚GitHub上通过New SSH key创建的key方框里，Title随便写或者直接空着不写也可以，直接点击Add SHH key就好了。
3.在GitHub添加SSH key之后，回到Git Bash界面输入ssh -T git@github.com查看是否添加成功，如果出现下图的问题，直接输入yes同意即可！
The authenticity of host 'github.com (192.30.255.113)' can't be established.
RSA key fingerprint is SHA256:nThbg6kXUpJWGl7E1IGOCspRomTxdCARLviKw6E5SY8.
Are you sure you want to continue connecting (yes/no)?
输入yes之后输入我们项目的密码
nter passphrase for key '/c/Users/User/.ssh/id_rsa':【这里的密码也是加密串】
4、出现如下提示时，就是成功了。
Hi HandsomeSuperRed! You've successfully authenticated, but GitHub does not provide shell access.
添加 SSH Key 到 Coding
这一步骤跟GitHub差不多所以我就直接跳过密钥获取教程了
1、我们依次点击右上方头像-个人账号设置进入账号设置界面
2、个人设置界面依次点击SSH公钥-新建公钥 然后随便输入一个公钥名称之后将我们的公钥复制进内容里面（跟GitHub的一样一个电脑使用一个公钥即可）
博客搭建
Hexo部署
1.安装好hexo之后，执行下面三条命令进行初始化：
hexo init
#初始化hexo(是你要保存博客内容的文件夹的名字。)
cd#进入此目录
npm install #安装
例如我想把博客保存在Hexo目录，上面三条代码就为：
hexo init Hexo
cd Hexo
npm install
执行命令的界面所示：
2.三条命令执行过后，Hexo的目录就添加了很多内容，而_config.yml文件是我们用次数会比较多，它是博客的一个全局配置文件。
3.Hexo初始化之后，我们执行下面三条命令对博客进行部署，同时开启本地服务
hexo generate
hexo deploy
hexo server
效果：
4.然后系统会出现如下提示：
INFO Start processing
INFO Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.
我们使用浏览器访问，发现Hexo在本地已经部署好了！
http://localhost:4000/
将博客双线部署至Github、coding
1.找到我们上面说的Hexo的全局配置文件
使用Notepad++进行编辑，将deploy一项修改成如图所示：
deploy:
type: git
message: “”
repo:
github: git@github.com:WangGang-a1/WangGang-a1.github.io.git,mastercoding: git@e.coding.net:nilinkeji/nilinkeji/nilinkeji.git,master
注意:repo需要更改为自己的地址，获取方式如下图，将其复制type后面即可。另外，冒号后面一定要加空格，否则部署会失败
2.更改完之后保存，我们就可以使用hexo命令发布到仓库中了：
hexo c
hexo g
hexo d
如果出现下面的提示恭喜你成功了！
3.这样就部署到 GitHub、coding 上了，可到GitHub、coding仓库查看是否更新。
4.GitHub部署成功之后，https://XXXX.github.io/ (只要将一级域名更改成你的账户名即可！) 这个地址就是我们的博客域名了，它可以用来访问你的博客，当然如果你也可以将它修改成自己的域名。
推荐一个可以获取免费域名的网站：freenom
5.Coding仓库同步之后我们依次点击持续部署-静态网站开通Coding Page然后按照提示进行即可，部署成功后会免费提供给你一个域名（后续与GitHub类似就不做过多讲解了）
博客主题
前面我们已经搭建好了自己的个人博客界面，这里我们深入学习一下hexo框架，首先我们修改一下hexo的主题，一个优美的博客主题往往会使你收到更多的流量，当然更多的是自己看着舒心。
这里我使用的是matery主题，当然也可以从Hexo主题中心选择自己喜欢的主题，下面我就以我使用的主题来进行讲解：
下载第三方主题
首先我们进入hexo-matery主题的GitHub仓库，
如图所示页面下滑找到Download主题，复制命令：
git clone https://github.com/blinkfox/hexo-theme-matery.git
复制完成后我们再来到我们的博客的本地目录的themes文件夹下，使用Git Bash命令行工具下载 matery主题 （注意：这里我安装过来，所以在themes下又新建了一个文件夹来下载，你们应该下载themes文件夹里）
恭喜！你成功下载了matery主题
更换主题
上一步我们下载完了第三方主题，下面我们将hexo默认主题更换为我们下载的第三方主题
首先我们进入博客的本地目录，使用Notepad++打开_config.yml文件进行修改。
按住Ctrl+F键搜索 theme 将theme: xxx 的xxx替换成你的主题名称。（例如我的主题是matery我的这里就应该是 theme: matery）
注意：这里的冒号应该是英文的，而且：后面应该有一个空格，否则可能造成博客崩溃！！！
到这里我们的博客主题就已经安装成功了。
博客背景、菜单栏等修改
博客背景、菜单栏等根据各主页的不同修改方式不同，具体请参照主题的GitHub仓库的官方文档修改.例如我的主题是matery，那么我的就去GitHub上搜索matery就可以进入主题仓库，根据文档修改即可，这里也就不做演示了。
编写博客
新建博客文件
在博客存放路径下使用Git Bash命令行工具输入以下命令：
hexo new "****"
将引号里面的***替换为你想要建立的博客文件的名称，下面我以love为名称作为演示：
这样就是建立完成了，它会自动生成一个love.md文件和一个love文件夹（如果没有这个文件夹就是图片插件有点问题）
love.md文件就是你的页面文件，编写博客内容都是在这里面编写，而love文件夹是用来存放引用的文件的，例如视频，图片之类的。
编写博客文件
使用Notepad++打开love.md文件，对博客文件进行编写
由于Hexo使用的是markdown语法，所以下面我们来介绍以下markdown语法用法
Markdown语法
Markdown是一种可以使用普通文本编辑器编写的标记语言，通过简单的标记语法，它可以使普通文本内容具有一定的格式。 –摘自百度百科
标题
代码：
# 一级标题
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 最小只有六级标题
效果：
会破坏博客目录，不予展示。
加粗
代码：
**加粗效果**
效果：
加粗测试
斜体
代码：
*斜体效果*
效果：
斜体效果
高亮
代码：
==高亮效果==
效果：
主题原因不予展示（matery替换了原生的高亮代码）
上标、下标
该段与word用法一致
代码引用（>式）
代码：
>引用效果
效果：
引用效果
代码引用（```式）
代码
# 不要复制这一句话，并且去掉下面的反斜杠！！！
\`\`\`bash
hello word！
\`\`\`
效果
hello word！
插入链接（显示）
代码
https://blog.qltxy.cn/
插入链接（隐藏）
代码
[逆鳞科技的部落阁](https://blog.qltxy.cn/)
效果
逆鳞科技的部落阁
分割线
代码
---
效果
由于主题原因会破坏结构不予展示（就是一条线，一般用不到）
有序列表
代码
1. one
2. two
3. three
效果
- one
- two
- three
无序列表
代码
* one
* two
* three
效果
- one
- two
- three
表格
（第二行必须得有，并且第二行的冒号代表对齐格式，分别为居中；右对齐；左对齐）
代码
name | age | sex
:-:|:-|-:
wda|25|男
dwd|6|女
效果
name | age | sex
:-:|:-|-:
wda|25|男
dwd|6|女
数学公式（行内嵌）
代码
内嵌数学公式$\sum_{i=1}^{10}f(i)\,\,\text{thanks}$
效果
内嵌数学公式$\sum_{i=1}^{10}f(i),,\text{thanks}$
数学公式（块状）
$$
\sum_{i=1}^{10}f(i)\,\,\text{thanks}
$$
效果
$$
\sum_{i=1}^{10}f(i),,\text{thanks}
$$
插入图片
安装插件
在hexo根目录打开Git Bash,执行以下代码
npm install hexo-asset-image --save
配置文件
打开hexo的全局配置文件_config.yml
查找 post_asset_folder选项，然后把false改成true
修改文件
在hexo目录下找到/node_modules/hexo-asset-image/index.js文件
用N++打开该文件，并将以下内容替换到该文件中：（该内容由Ericam_ 大神提供：https://blog.csdn.net/xjm850552586）
'use strict';
var cheerio = require('cheerio');
// http://stackoverflow.com/questions/14480345/how-to-get-the-nth-occurrence-in-a-string
function getPosition(str, m, i) {
return str.split(m, i).join(m).length;
}
var version = String(hexo.version).split('.');
hexo.extend.filter.register('after_post_render', function(data){
var config = hexo.config;
if(config.post_asset_folder){
var link = data.permalink;
if(version.length > 0 && Number(version[0]) == 3)
var beginPos = getPosition(link, '/', 1) + 1;
else
var beginPos = getPosition(link, '/', 3) + 1;
// In hexo 3.1.1, the permalink of "about" page is like ".../about/index.html".
var endPos = link.lastIndexOf('/') + 1;
link = link.substring(beginPos, endPos);
var toprocess = ['excerpt', 'more', 'content'];
for(var i = 0; i < toprocess.length; i++){
var key = toprocess[i];
var $ = cheerio.load(data[key], {
ignoreWhitespace: false,
xmlMode: false,
lowerCaseTags: false,
decodeEntities: false
});
$('img').each(function(){
if ($(this).attr('src')){
// For windows style path, we replace '\' to '/'.
var src = $(this).attr('src').replace('\\', '/');
if(!/http[s]*.*|\/\/.*/.test(src) &&
!/^\s*\//.test(src)) {
// For "about" page, the first part of "src" can't be removed.
// In addition, to support multi-level local directory.
var linkArray = link.split('/').filter(function(elem){
return elem != '';
});
var srcArray = src.split('/').filter(function(elem){
return elem != '' && elem != '.';
});
if(srcArray.length > 1)
srcArray.shift();
src = srcArray.join('/');
$(this).attr('src', config.root + link + src);
console.info&&console.info("update link as:-->"+config.root + link + src);
}
}else{
console.info&&console.info("no src attr, skipped...");
console.info&&console.info($(this));
}
});
data[key] = $.html();
}
}
});
插入图片
现在就可以插入图片了，比如hexo new “love”之后
就在source/_posts生成love.md文件和love文件夹，我们把要插入的图片复制到love文件夹内，
在love.md文件里面按markdown的标准写,（我的文件名是moban.png）
例如我插入一个图片（无文字）：
效果：
例如我插入一个图片（有文字）：
效果：
更换博客域名
域名准备
1、在阿里云、腾讯云和华为云等云服务商家购买域名，这一步就不过多讲解了
2、通过freenom获取一个免费域名，然后通过DNSPOS进行分发。
绑定域名
这里我以腾讯云为例进行讲解，首先登陆腾讯云DNS解析后台,
点击解析进入记录管理添加两行记录
主机记录建议填写blog，类型选择CNAME
github记录值填***.github.io.（***为你的GitHub昵称，例如我的昵称为WangGang-a1,我就填写WangGang-a1.github.io.）
coding的记录值需要根据coding自定义域名时显示的来填写
注意：两个域名必须相同，这样使用起来方便
GitHub仓库修改
进入你的GitHub仓库 进入Settings-GitHub Pages-Soyrce选择master
刷新一下网页进入GitHub Pages-Custom domain填入自定义的域名，例如我的是blog.qltxy.cn
Coding仓库修改
进入Coding仓库的静态网站部署（新版页面为网站托管）
进入部署依次点击 自定义域名-新建域名
根据提示去你的域名解析里面添加，一定要与coding提供的信息完全相同，不然会出现错误。
添加完成后就可以使用自己的域名访问啦！
总结
一顿操作下来虽然有点儿累，但看见拥有了私人博客还是非常有成就感的，人生嘛，不就是需要折腾，实践才能增长知识，我相信在不久的将来，你会从中受益良多！
