Github+Hexo搭建个人博客

作为一名技术小白，一直秉承着极高的热情向技术大佬们学习，可是学着学着就发现学过的东西很容易忘记，所以打算创建一个个人博客来进行记录总结，一方面可以总结学习过程中遇到的错误和困难，一方面也可以方便其他童鞋进行参考，接下来就和我一起学学怎么搭建个人博客吧！

我们先来看一下大体的搭建步骤：

• 获得个人网站域名
• 安装Git和Node.js
• GitHub创建个人仓库
• 安装Hexo
• 推送网站
• 绑定域名
• 更换主题

好啦，接下来就和我一起一步步进行操作吧~

1. 获得个人网站域名

首先进行域名注册的原因是，域名注册也需要审核哦，会耗费时间，所以我们先进行域名注册，在等待的时间里来进行接下来的其他操作，这样就省时省力啦！

域名是网站的入口，也是网站的第一印象，比如饿了么的官网域名是：https://www.ele.me/，很是巧妙。常见的有com,cn,net,org等后缀，也有小众的xyz,me,io等后缀，根据你自己的喜好，选择不同的后缀比如，我选择的是work后缀，原因很简单，因为在搞活动一年1块钱，所以果断下手。

申请域名的地方有很多，这里推荐阿里云：阿里云-为了无法计算的价值 ，申请入口：域名注册 购买域名这也是我们整个搭建过程中惟一一个需要花钱的地方。如果你已经有了空闲域名就无需购买，直接使用就好啦。

2. 安装Git和Node.js

1) 安装Git

什么是Git?简单来说Git是开源的分布式版本控制系统，用于敏捷高效地处理项目。我们网站在本地搭建好了，需要使用Git同步到GitHub上。
Git下载地址：https://git-scm.com/download/win

现在大部分机子是64位的，选择64位的安装包下载安装，在命令行里输入git --version是否安装成功，若安装失败，参看其他详细的Git安装教程。如果想要了解Git的细节，参看廖雪峰老师的Git教程：Git教程

2) 安装Node.js

Hexo基于Node.js，Node.js下载地址：https://nodejs.org/en/download/ 下载安装包，注意安装Node.js会包含环境变量及npm的安装。
检测Node.js是否安装成功，在命令行中输入node -v ；
检测npm是否安装成功，在命令行中输入npm -v 。
显示如下则安装成功哦！

3. GitHub创建个人仓库

登录到GitHub,如果没有GitHub帐号，使用你的邮箱注册GitHub帐号，创建并登录，点击GitHub中的New repository创建新仓库，仓库名应该为：用户名.github.io 这个用户名使用你的GitHub帐号名称代替，这是固定写法，比如我的仓库名为：lililich.github.io。

接下来，将你的Git与GitHub帐号绑定，鼠标右击打开Git Bash。
设置user.name和user.email配置信息：

1
2

$git config --global user.name "你的GitHub用户名"
$git config --global user.email "你的GitHub注册邮箱"

生成ssh密钥文件,生成一个公钥和密钥，因为 GitHub 需要一个密钥才能与本地相连接。然后直接三个回车即可，默认不需要设置密码。

1

$ssh-keygen -t rsa -C "你的GitHub注册邮箱"

ssh key生成之后会默认保存在 C:/Users/电脑名用户名/.ssh目录中，打开这个目录，id_rsa.pub是公钥，id_rsa是密钥,接下来打印公钥信息：

1

$cat ~/.ssh/id_rsa.pub

打开 GitHub ，依次点击 头像-->Settings-->SSH and GPG keys-->Add SSH key，Title为标题，任意填即可，将刚刚复制的id_rsa.pub内容粘贴进去，最后点击Add SSH key，SSH KEY 配置成功。
在Git Bash中检测GitHub公钥设置是否成功，输入ssh git@github.com测试连接，显示如下则连接成功。

这里之所以设置GitHub密钥原因是：通过非对称加密的公钥与私钥来完成加密，公钥放置在GitHub上，私钥放置在自己的电脑里。GitHub要求每次推送代码都是合法用户，所以每次推送都需要输入账号密码验证推送用户是否是合法用户，为了省去每次输入密码的步骤，采用了ssh，当你推送的时候，git就会匹配你的私钥跟GitHub上面的公钥是否是配对的，若是匹配就认为你是合法用户，则允许推送。这样可以保证每次的推送都是正确合法的。

4. 安装Hexo

Hexo就是我们的个人博客网站的框架，这里需要自己在电脑常里创建一个文件夹，可以命名为Blog，Hexo框架与以后你自己发布的网页都在这个文件夹中。
首先使用npm命令安装Hexo，输入：

1

$npm install -g hexo-cli

这个安装时间较长耐心等待，安装完成后，初始化我们的博客，输入：

1

$hexo init blog

为了检测我们的网站雏形，分别按顺序输入以下三条命令：

1
2
3

$hexo new test_my_site   //新建文章
$hexo g                            //hexo generate生成
$hexo s                            //hexo server启动服务预览

注意，当时直接在Blog文件夹中输入这三条指令一直报错，找了许久才找到了解决方法。https://www.jianshu.com/p/2f4aca924fdb这里形容得太贴切了，在大街上喊老婆肯定大海捞针啊哈哈哈，要进入相应的目录再喊指令就会成功了，就是说，我们要进入刚刚new初始化下的blog文件夹下运行上述三条指令。
完成后，打开浏览器输入地址:localhost:4000就可以在本地看到我们写的第一篇博客啦！
开不开心！兴不兴奋！

5. 推送网站

上面只是在本地预览，接下来要做的就是就是推送网站，也就是发布网站，让我们的网站可以被更多的人访问。在设置之前，需要解释一个概念，在blog根目录里的_config.yml文件称为站点配置文件，进入根目录里的themes文件夹，里面也有个_config.yml文件，这个称为主题配置文件，两个网站不要搞混。

下一步将我们的Hexo与GitHub关联起来，打开站点的配置文件_config.yml，翻到最后修改并保存为：

1
2
3
4

deploy: 
type: git
repo: https://github.com/lililich/lililich.github.io.git      //这里填入你之前在GitHub上创建仓库的完整路径，记得加上.git
branch: master

其实就是给hexo d 这个命令做相应的配置，让hexo知道你要把blog部署在哪个位置，很显然，我们部署在我们GitHub的仓库里。
最后安装Git部署插件，输入命令：

1

$npm install hexo-deployer-git --save

这时，我们分别输入三条命令：

1
2
3

$hexo clean      //清除缓存，若是网页正常情况下可以忽略该条指令
$hexo g          //hexo generate生成网站
$hexo d          //hexo deploy部署网站

完成后，打开浏览器，在地址栏输入你的放置个人网站的仓库路径，即 http://xxxx.github.io (知乎排版可能会出现”http://“字样) 比如我的xxxx就是我的GitHub用户名：lililich
你就会发现你的博客已经上线了，可以在网络上被访问了！访问网址为 http://xxxx.github.io

6. 绑定域名

虽然在Internet上可以访问我们的网站，但是网址是GitHub提供的:http://xxxx.github.io (知乎排版可能会出现”http://“字样) 我们想使用我们自己的个性化域名，这就需要绑定我们自己的域名。这里演示的是在阿里云万网的域名绑定，在国内主流的域名代理厂商也就阿里云和腾讯云。
第一步，登录到阿里云，进入管理控制台的域名列表，找到你的个性化域名，进入解析，然后添加解析。
第一个记录类型是A，ping你的 http://xxxx.github.io 的ip地址，将ip地址填入记录值。
第二个记录类型是CNAME，CNAME的记录值是：你的用户名.github.io,这里千万别弄错了。

第二步，登录GitHub，进入之前创建的仓库，点击settings，设置Custom domain，输入你的域名，如我的域名是lililich.work,保存添加。
第三步，进入本地博客文件夹 ，进入blog/source目录下，创建一个记事本文件，输入你的域名，对，只要写进你自己的域名即可。如果带有www，那么以后访问的时候必须带有www完整的域名才可以访问，但如果不带有www，以后访问的时候带不带www都可以访问。所以建议，不要带有www。保存，命名为CNAME ，注意保存成所有文件而不是txt文件。
完成这三步，进入blog目录中，按住shift键右击打开命令行，再依次输入：hexo clean hexo g hexo d
这时候打开浏览器在地址栏输入你的个性化域名将会直接进入你自己搭建的网站。

7. 更换主题

如果你不喜欢Hexo默认的主题，可以更换不同的主题，主题传送门：Themes。 目前用的比较多的是Next主题，我自己使用的是cube主题。现在把默认主题更改成cube主题，在blog目录中（就是命令行的位置处于blog目录）打开命令行输入：

1

$https://github.com/ZEROKISEKI/hexo-theme-cube.git themes/cube    //下载cube主题

这是将cube主题下载到blog目录的themes主题下的cube文件夹中。打开站点的_config.yml配置文件，修改主题theme：cube
选择好后，再次部署网站，hexo g、hexo d，查看效果。选择其他主题，按照上述过程即可实现。接下来就去Markdown网站上学习一下写博客用到的语法吧,你就可以尽情的书写自己的博客啦！