教你利用Hexo快速搭建Github个人博客之Mac篇

关于本文

写本文主要是为了记录下我在Mac系统下利用Hexo搭建Github个人博客的全流程，梳理下刚刚踩过的坑。

什么是Hexo

搭建网站和博客的程序有很多，搭建难易程度各不相同。比如用户规模非常大的老牌博客系统Wordpress，还有小众程序Typecho。先介绍下Hexo：

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。
以上介绍来自Hexo官网，已经很明确的表明了Hexo的两个特点：轻量、Markdown。

轻量
不用多说，采用Hexo建立需要掌握一定的代码基础和动手折腾能力。
Markdown
Markdown是一种非常流行的轻量标记语言，语法简单易掌握，很受欢迎。

什么是Github

GitHub是一个面向开源及私有软件项目的托管平台，因为只支持git 作为唯一的版本库格式进行托管，故名gitHub。目前已经被微软花了75亿美元的股票交易收购。
你肯定会问题，为什么不自己买服务器来建立个人博客呢？至少有三个优点：

免费
免费不用说了，一个国内入门级的空间至少一年也要200到300块；
免备案
买国内服务器备案是标配，至少要花掉一个月的时间审核备案；
支持自定义域名
免费空间还支持自定义独立域名，可用空间高达1G没得说。
不过唯一要担心的就是Github的可用性，目前微软收购后，据我观察，可用性还是非常高的。

回归正题来利用Github搭建个人博客

首先需要准备的资料

任何一台macOS系统的电脑（本文只介绍macOS环境下搭建流程）；
已经拥有Github账号
如果还没有可以重新注册，注册地址The world’s leading software development platform · GitHub，全站暂无中文，可以借助Google翻译来了解注册流程，很简单。
注册成功后，从右上角进入仓库-新建仓库-仓库命名一定要命名成username.github.io“username”就是你的Github地址，这个必须按照这个要求来注册，否则可能会出现问题。
安装Xcode,node.js和nvm
这三个东西你都可以把他们理解为macOS下的环境配置。
Xcode直接在Mac App Store上搜索下载，node.js当然也可以去他们的官网（支持中文）上下载安装，附上中文官网下载地址：Node.js，下载后一路图形化界面安装即可。
nvm安装是在macOS的终端里安装，这是官方网址：GitHub - creationix/nvm: Node Version Manager - Simple bash script to manage multiple active node.js versions
安装代码如下（版本更新链接会做改变）：

curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.34.0/install.sh | bash

以上环境都配置OK之后，主要就是安装Hexo，上传到Github的工作了。

安装Hexo博客系统

以下的安装工作基本上都是在macOS的终端里完成，需要掌握一定的代码阅读能力，可以借助搜索引擎。

安装Hexo
npm install -g hexo-cli
为了后面把Hexo发布到Github上，同时安装hexo-deployer-git
npm install hexo-deployer-git --save

Hexo官方安装指导手册：文档 | Hexo

选定Hexo博客本地存放位置
比如我把它放在电脑的文稿位置：/Users/bobo/Documents/bobo.ink，bobo.ink是我的博客根目录文件夹。选定并建立相应的文件夹之后，在终端里利用cd命令cd /Users/bobo/Documents/bobo.ink来定位并访问博客根目录。你也可以在终端里输入cd加空格，同时利拖拽来获得文件夹绝对地址也可以。当终端定位到该目录后，接下来的操作基本上也就在这个目录下进行了。
首先执行命令：

Hexo init

执行命令完毕后，该命令将在当前目录下生成一套标准的Hexo博客项目模板。

生成可访问网站

上面的一顿操作虽然猛如虎，但其实只是在本地博客文件夹里生成了一源代码文件。后期需要对这些文件进行个性化代码修改，比如主题更换。

生成HTML格式页面
生成服务器可识别的标准HTML网站目录，此时可使用该命令：

hexo g

执行完毕后，在public目录下可看到我们自己书写的博客文档（.md文件）与所选的博客主题模板链接组合，生成的最终静态网站文件，该目录也差不多就是之后发布到GitHub上的实际文件（实际发布到GitHub的是.deploy_git目录），外部的网站“源代码”不会上传到github.io库。

启动本地服务器

启动本地服务器命令行可即时查看网站运行效果：

hexo s

Hexo的本地访问地址：http://localhost:4000。
本地服务器可以用来调试主题和其它界面，其实也没啥大用，最终还是要上传到Github上来维护的。但是启动后如果想要停止本地服务器访问，可以直接在终端里按Ctrl(control)+C。

更新主题

首先我们可以在Hexo官网：Themes | Hexo寻找适合我们的主题，然后下载下来，解压并放到本地博客文件夹themes下，如比新主题的文件夹名称是newboy，那么我们就文件夹_config.yml

重新根据新主题构建博客：

hexo g

分享十个在Github上最受欢迎的主题模板（以star数量计）：
下面贴出github上star数量最多的前10个主题（截至目前为止）：

GitHub - iissnan/hexo-theme-next: Elegant theme for Hexo.；
GitHub - litten/hexo-theme-yilia: 一个简洁优雅的hexo主题 A simple and elegant theme for hexo.
GitHub - TryGhost/Casper: The default personal blogging theme for Ghost
GitHub - wuchong/jacman: Jacman is a fresh looking and responsive theme for Hexo with more features based on Pacman.
GitHub - A-limon/pacman: Pacman is a flat and responsive design theme for Hexo.
GitHub - daleanthony/uno: Uno - a minimal, responsive theme for Ghost
GitHub - orderedlist/modernist: A Theme for GitHub Pages
GitHub - presscustomizr/hueman: Hueman WordPress Theme
GitHub - kathyqian/crisp: A minimalist, responsive, and open-source theme for Ghost
GitHub - xiangming/landscape-plus: 针对中国大陆地区对hexo官方主题landscape进行优化。

创建github ssk密钥

生成新的SSH Key

ssh-keygen -t rsa -C "[email protected]"

其中[email protected]是我们在GitHub注册时使用的邮箱。

成功运行后终端显示如下：

Generating public/private rsa key pair.
Enter file in which to save the key (/Users/xxx/.ssh/id_rsa):

接下来提示我们保存.ssh/id_rsa的路径，一路回车。

Created directory '/Users/xxx/.ssh'.
Enter passphrase (empty for no passphrase):

当使命行提示输入 passphrase，为了避免“失误”和“麻烦”，建议直接回车，不设置密码。

成功后应该显示：

Your identification has been saved in /Users/xxx/.ssh/id_rsa.
Your public key has been saved in /Users/xxx/.ssh/id_rsa.pub.
The key fingerprint is:
16:27:ac:a5:76:28:2d:36:63:1b:56:4d:eb:df:a6:48 [email protected]
The key's randomart image is:（后面图形省略）

添加Key到Github的SSH设置里
还记得我们已注册过Github了吧？通过右上角的设置访问SSH and GPG keys页面，通过绿色按钮New SSH Key 新建SSH。其中Title随意命名，能帮助你区别和记忆就好。Key里直接输入复制来的id_rsa.pub里的所有内容。
如何复制id_rsa.pub里的内容，请打开 id_rsa.pub，终端命令：

vim ~/.ssh/id_rsa.pub

或者直接通过命令复制全部内容：

pbcopy < ~/.ssh/id_rsa.pub

检测SSH key：

ssh [email protected]

SSH key 成功访问 GitHub则显示：

Hi your_name! You've successfully authenticated, but GitHub does not provide shell access.
Connection to github.com closed.

修改博客配置文件_config.yml并添加以下内容：

  type: git
  repo: GitHub上传仓库的完整路径，如 https://github.com/wavky/wavky.github.io.git
  branch: master

发布博客到Github

重新更新并生成博客：

hexo g

通过命令发布博客：

hexo d

或者两个命令一起执行：

hexo g -d

绑定独立域名

GitHub Pages 默认提供的是 GitHub用户名.github.io作为博客访问地址，我们可以设置绑定自定义域名。

首先，在博客项目目录的source文件夹中，创建一个CNAME文件，存储预备使用的个人域名，如：

# 在source目录下
echo bobo.ink > CNAME

清理Hexo缓存并重新生成发布：

hexo clean
hexo g -d

在Github刚刚创建的仓库项目里，在设置Setting界面，滚到GitHub Pages部分Custom domain确认域名无误。
同时到域名所在的域名服务商设置DNS：
以阿里云为例，进入DNS设置界面，追加一条CNAME记录，详细如图：

BOBO.IMG.0001.png

如果一切顺利的话，咱们应该已经可以使用独立域名访问我们的博客了。

如何维护和更新博客

以下是发布博客文章常用的命令：

$ hexo new(n)    //写文章
$ hexo generate(g)    //把文章生成页面
$ hexo server(s)    //启动本地服务调试
$ hexo deploy(d)    //部署到github 可与hexo g合并为 hexo d -g

用hexo发表新文章

打开macOS终端，cd定位到本地博客文件夹，输入如下命令：

$ hexo n "你好世界"

直接发布新文章
其中“你好世界”为文章标题，执行命令 hexo n “你好世界” 后，会在项目 \本地博客文件夹\source_posts 中生成你好世界.md文件，用编辑器打开即可编写正文内容。
写完后，推送到服务器上，执行以下命令即可在我们的站点看到新的文章。
在草稿箱撰写文章

上面的命令是直接发布文章，现在我们也可以先写文章放在草稿箱，暂时不发出去。通过命令行：

hexo new draft 你好中国

我们会在source下看见一个新的文件夹，_drafts，这个里面会装我们所有的草稿文件。

那写好了的草稿，如何可以在不发布的情况下，预览一下文章在网站上的样子呢？预览下草稿：

hexo server --draft

当然，你要先shut down原来开着那个server，才可以开启新的server。这样，我们就可以预览草稿文件是否合适了。

发布草稿内容
当我们准备好发布草稿时，我们可以运行命令：

hexo publish 你好中国

发布Normal Page
这里的Normal Page类似其它博客里的“关于我们”之类，利用命令新建：

hexo new page 关于我们

这个命令会在source文件夹内创建出”关于我们“”文件夹，只能通过链接访问。

用Markdown写文章

我们都知道Hexo支持Markdown标记语法，那么我们自然可以直接利用Markdown编辑器撰写文章，保存为.md格式的文件，存在source文件夹里，然后执行命令：

hexo d -g

这样一篇文章就可以发布到我们的个人博客下了，放心写起来吧：）