Hexo+GitHub 30分钟拥有属于自己的网站

说在前面的话

很多ITer都想拥有一个个人网站，记录自己工作经验和生活。哪怕已经有了简书这样好的一个平台，但是那种情节并没有就此打消。下面给大家分享下我个人网站创建流程及中途遇到的坑，希望对那些想建站却又嫌麻烦的朋友有所帮助。

准备工作

在开始前要做好系列准备工作，如环境搭建、GitHub账号注册等。下面分别来看下要做哪些：

GitHub官网

账号注册
如果你还没有GitHub账号，请前往官网注册。如果已经注册过，请登录
创建仓库
登录后，点击左上角+号创建仓库：

index.png

在新的创建页面，写上 yourname.github.io ，然后下方选框勾上(我当时没有勾后来本地文件向git提交时出了点小问题)。yourname最好就是你的GitHub的名字，

index1.png

Git客户端安装

安装
Git可以直接从官网下载系统版本自行选择。
Git安装基本也可以认为一路next点过来，如果你的 on the Desktop没有勾选的话，为了方便可以勾选上

index3.png

验证
同样为了查看是否正确安装，需要从命令行查看能否正确显示版本信息：
```
git --version
```

如果显示了版本信息，则说明正确安装：

git version 2.12.2.windows.2

配置git
- 配置Git的user name和email：
```
git config --global user.name "你的名字"
git config --global user.email "你的git使用的邮箱"
```
- 生成密钥：
  使用ssh-keygen -t rsa -C 你的git使用的邮箱命令生成密钥，输入命令后连续点击好像三四次回车就行，出现的一些设置提示不用管，全部默认就行。执行完成后会生成密钥文件如图：

index4.png

密钥和GitHub关联
编辑器打开id_rsa.pub复制所有内容。
打开GitHub Setting如图：

index5.png

找到SSH key，点击new SSH key，把内容粘贴到key文本框中，title随意起，保存，如下图：

index6.png

Node.js

安装
我笔记本是win系统，所以关于Node.js下载：
32位下载
 64位下载
如果是其他系统，需要自行去官网下载。
关于安装没有什么注意的，反正我是一路next，如图：

index7.png

验证
安装完成后，可以像JDK一样，使用命令行验证是否正确安装，在cmd命令窗口执行以下：
```
node -v
npm -v
```
如果正确显示了当前版本号，则说明安装成功：
```
v4.2.3
2.14.7
```
否则，请根据具体异常信息搜索下。

Hexo

安装
在合适地方创建一个文件夹并命名，例如我在 E盘下创建了hexo文件夹：
通过命令行进入该文件夹目录下：
```
C:\Users\Jenson>E:
E:\>cd hexo
E:\hexo>
```
执行 npm命令安装hexo：
```
npm install hexo-cli -g
```
期间cmd窗口会自动刷出一些信息，可能会有warn不过不要紧。待命令执行完毕，继续执行
```
npm install hexo --save
```
这时又会有信息刷屏，信息滚动完毕，通过
```
hexo -v
```
命令验证是否安装成功。
如果出现了下面字样，说明安装成功了：

图片.png

初体验
- 窗口中继续执行
```
hexo init 
```
初始化
- 执行
```
npm install
```
自动安装所需组件，直到完成
- 执行
```
hexo g
```
- 执行
```
hexo s
```
启动本地服务，在浏览器地址栏输入
```
http://localhost:4000/
```
看能否打开本地部署的网站，如果成功打开，恭喜你本地部署完成。

本地hexo关联到GitHub

本地网站已经可以打开，接下来要把hexo部署到GitHub上，让别人也能访问。
在hexo目录下找到_config.yml文件，按如下格式修改成你的：

deploy:
  type: git
  repo: https://github.com/Jensonss/Jensonss.github.io.git
  branch: master

修改完成后，执行

hexo d -g

生成部署，这样就会根据刚才的GitHub地址commit到GitHub仓库，首次的话会弹窗让你输入你的GitHub登录的用户名和密码。登录成功后就会自动commit了。
此时通过 xxx.github.io 应该是可以访问你的网站了。

个性域名绑定

购买域名

我的域名是在万网购买的，不过进入网站才发现万网成了阿里云的二级域名，不知道什么时候被阿里云收购了。购买通道猛戳,用淘宝账号直接登录，由于是个人使用所以我选了 .me 类型的，而且13元/首年价格比较便宜，以后续费价格好像是89元/年。

付款时会让选择持有者是个人还是企业，选择个人，然后创建一个个人使用的信息模板，可能由于我的是.me域名，所以没有进行身份证验证也能使用。

域名DNS解析

购买后的域名不能直接使用，因为现在只是把域名颁发给你，但是还没有和IP地址绑定，还需要进行DNS解析。
在你购买后，可以直接点击域名进入域名控制台，页面长这样：

index8.png

点击左侧的菜单-云解析DNS，然后再点击你的域名：

index9.png

进入了新手引导设置：

index10.png

如果点击设置网站解析，进入的页面只能输入一个IP地址，由于GitHub有2个IP地址要绑定，所以我直接选择了高级设置，点击添加解析，添加如下三条记录，其中xxx.github.io ，xxx为你得GitHub配置的名称：

index11.png

注意：CNAME 必须大写
这样过几分钟域名就会生效了，

域名绑定

上一步DNS解析用到了CNAME ，现在在hexo/source目录下创建一个不带后缀的文件，名为CNAME，内容只填写你购买的域名：