Windows下使用Github Pages+Hexo搭建博客(详细快捷)

简言

在互联网渗透到个人，自媒体信息爆炸的今天，大家都希望有一个归自己所有、掌控的个人博客。因为无论是记录生活，还是分享技术，自定义博客都可以按照自己的要求，为自己提供熨帖的服务，而不必受到条条框框的限制。但是普通用户又囿于没有高超的编程技术和前端本领，而在自定义博客面前望而却步了。本文的目标就是通过介绍 Hexo+Github/Coding.net+Travis CI+形成一套完整的个人博客自动构建、部署、国内国外双线路负载均衡的系统。真正做到随时随地写文章，一键部署到网站的全自动化流水线。

Hexo 是一个极速、简单且强大的静态博客架构。它使用 Node.js 作为构建引擎，上百个文件在几秒钟内便可构建完成；而且拥有着丰富的插件库，因开源而显得生机勃勃，可扩展性很好；最重要的，它支持 Markdown 作为书写语言，极大地方便了博客的撰写。

前面的文章总结了现有的博客类型以及根据现有的情况推荐使用的方式搭建博客。这个时代在发展中，个人也是要有点追求的。使用第三方的博客虽说不用怎么维护，但是这种”寄人篱下”的感觉总归不是太好的，说不定哪一天人家的数据库爆炸服务器没了，咱们的资料可是找不回来的。玩笑归玩笑，主要还是技术需要提升。咱这个最初的阶段(CSDN使用)使用了一段时间了，这里我们进入第二个阶段使用Github Pages+静态网站生成技术搭建博客，静态网站搭建技术也有许多，查阅了资料后较为推荐使用Hexo，当然也可以使用jekyll和hugo。(至于为什么使用Github，当然是因为免费的，可以提供域名让人家能访问到你，如果你有自己的服务器和域名推荐使用更好的方式,例如Wordpress等等)这里总结一下Github Pages+Hexo的方式，中间的很多坑也是搞的自己很头疼，这里也总结出一些容易犯的问题以供参考。好了这里直接进入正题！
我们为了更好的记录此次搭建过程，这里分为五个步骤

注册GitHub账号

1.浏览器访问GitHub官方网站

1	https://github.com/

进入官网页面之后，写好用户名、邮箱、密码信息，然后点击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即可。

eg:
Owner:LiuXiangYang-Git
对应的仓库名就是
LiuXiangYang-Git.github.io

恭喜，至此Github注册完成并创建了GitHub Pages个人博客的仓库（Repository）。

关于Github的使用我知道的也不多，这里也就不详细的介绍它了，如果有想要了解的可以自行百度相关教程

安装Node.js

Node.js官网下载地址，安装过程没什么可说的，一直点下一步即可。
注意要规划好安装的目录，这里我们为了此次教程专门新建一个大的文件夹专门存放此次实践，这也是一个好的习惯！

1	https://nodejs.org/zh-cn/

安装完成！

安装Git

Git官网下载地址，安装过程也是没什么可说的，虽然中间步骤很多要选的选项也是不少，不过我们也是统统Next即可

1	https://git-scm.com/downloads

图十一
安装完成！
在这里插入图片描述

Git配置SSH

1.安装完Git之后，我们需要使用SSH将本地Git项目与远程的GitHub建立联系。
这里我们发现Git安装之后会生成两个快捷方式，这里我们需要使用Git Bash
图十二
点击Git Bash

依次输入：

git config --global user.name "Your Username" #要输入你的用户名(Github)

git config --global user.email "Your Email Address" #要输入你的邮箱地址(Github)

注意这里Your Username和Your Email Address就是注册GitHub账号时的用户名和邮箱。因为使用仓库前，要通过Username和Email标明自己的身份。
2.保持刚才的窗口继续输入以下命令

1
2
3

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。
执行命令之后，出现下面内容

1
2
3

Generating public/private rsa key pair.

Enter file in which to save the key (/Users/your_user_directory/.ssh/id_rsa):

这里我们直接敲击回车
然后会出现提示输入密码
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文件，也就是刚才生成的SSH key。如果看不到这个文件，需要设置显示隐藏的文件。将本地文件里的SSH key全选复制粘贴到刚刚GitHub上通过New SSH key创建的key方框里，Title随便写或者直接空着不写也可以，直接点击Add SHH key就好了。
图十五
图十六
3.在GitHub添加SSH key之后，我们需要测试是否添加成功，输入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.当系统出现如下提示时，说明成功了。

1	Hi HandsomeSuperRed! You've successfully authenticated, but GitHub does not provide shell access.

Hexo安装

刚才的准备工作做了一大堆，也没有看到实在的东西，这里我们进行到这一步就可以有本地的博客了。开始喽！
1.首选安排好你的博客安装路径，在此路径右击找到GitBash,例如我们的目录为
D:\Myblog\Blog，右击Git Bash Here

图十八
2.打开Git Bash以后输入npm install -g hexo-cli安装Hexo，
安装好以后不要关闭Git Bash，接下来还要用。Hexo有它的默认路径，能够看到Hexo都安装在了C盘。
图十九

Hexo部署

1.安装好hexo之后，我们需要执行下面三条命令进行初始化工作

hexo init <folder> #初始化hexo(是你要保存博客内容的文件夹的名字。)

cd <folder> #进入此目录

npm install #安装

其中，

例如我想将博客保存在Hexo目录中，那我就使用hexo init Hexo命令。如果你不想用Hexo命名，你想将文件夹叫做Handsome，那你可以使用Hexo init Handsome命令。所以上面三个命令就是：

hexo init Hexo

cd Hexo

npm install

执行命令的界面所示
图二十
图二十一
2.三条命令执行过后，看一下我们刚才Hexo的目录内容，其中_config.yml文件是我们用的比较多的配置文件
图二十二
3.Hexo初始化之后，我们需要部署并且开启服务，执行下面三条命令

hexo generate

hexo deploy 

hexo server

效果如下图所示
图二十三
图二十四
4.然后系统会出现如下提示：

1
2
3

INFO  Start processing

INFO  Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.

浏览器访问http://localhost:4000/，发现Hexo在本地已经部署好了！
图二十五

将本地文件(Hexo)部署至Github

1.找到我们上面说的Hexo的配置文件
图二十六
使用工具打开进行编辑，找到deploy一项
修改成如图所示

deploy:
  type: git
  repo: git@github.com:LiuXiangYang-Git/LiuXiangYang-Git.github.io.git
  branch: master

图二十七
注意这里的repo需要进行修改更改成自己的地址，获取方式如下，将其复制到type后面即可，还有一个需要注意的地方是冒号后面一定要加空格，否则部署会失败

图二十八
2.更改完之后保存，这里我们就可以使用hexo命令发布到仓库中了，还是同样的命令(发布到本地)

hexo clean

hexo generate

hexo deploy

图二十九
如果出现下面的提示恭喜你成功了！
图三十
3.这时就已经部署到 GitHub 上了，可以到你的GitHub仓库查看是否已经更新。
图三十一
4.成功之后，这个地址就是我们的博客域名了，可以使用他来访问你的博客，当然如果你有自己的博客，也可以修改成自己的。

1	https://liuxiangyang-git.github.io/

只要将一级域名更改成你的账户名即可！
在这里插入图片描述
5.后面教程我们在详细实践如何自定义网站内容，我也是在摸索后面持续更新。。。

总结

一顿操作下来虽然有点儿累，但看见拥有了自己的博客还是非常有成就感的，人生就是需要折腾，那么现在就开始你的创作之旅吧！文章的不断积累，你会从中受益很多的！

{{date}}		{{temperature}}		{{humidity}}
{{time}}
{{ip}}	{{city}}		{{daylight}}