使用Coding和Hexo搭建免费静态Blog

喜欢写Blog的人，会经历三个阶段。

第一阶段，刚接触Blog，觉得很新鲜，试着选择一个免费空间来写。
第二阶段，发现免费空间限制太多，就自己购买域名和空间，搭建独立博客。
第三阶段，觉得独立博客的管理太麻烦，最好在保留控制权的前提下，让别人来管，自己只负责写文章。
大多数Blog作者，都停留在第一和第二阶段，因为第三阶段不太容易到达：你很难找到俯首听命、愿意为你管理服务器的人。
但是六年前，情况出现变化，一些程序员开始在GitHub网站上搭建blog。他们既拥有绝对管理权，又享受GitHub带来的便利—-不管何时何地，只要向主机提交commit，就能发布新文章。更妙的是，这一切还是免费的，GitHub提供无限流量，世界各地都有理想的访问速度。
今天，我就来示范如何在GitHub上搭建Blog，你可以从中掌握GitHub的Pages功能，以及Hexo软件的基本用法。更重要的是，你会体会到一种建立网站的全新思路。

---

概要

GitHub Pages 是什么？

---

如果你对编程有所了解，就一定听说过GitHub。它号称程序员的Facebook，有着极高的人气，许多重要的项目都托管在上面。简单说，它是一个具有版本管理功能的代码仓库，每个项目都有一个主页，列出项目的源文件。

但是对于一个新手来说，看到一大堆源码，只会让人头晕脑涨，不知何处入手。他希望看到的是，一个简明易懂的网页，说明每一步应该怎么做。因此，GitHub就设计了Pages功能，允许用户自定义项目首页，用来替代默认的源码列表。

所以，GitHub Pages可以被认为是用户编写的、托管在GitHub 上的静态网页。

GitHub 提供模板，允许站内生成网页，但也允许用户自己编写网页，然后上传。有意思的是，这种上传并不是单纯的上传，而是会经过Hexo或Jekyll等程序的再处理。
什么是Hexo？

---

Hexo 是一个快速、简洁且高效的基于Node.js的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。作者是来自台湾的@tommy351。

A fast, simple & powerful blog framework, powered by Node.js.

类似于jekyll、Octopress、Wordpress，我们可以用Hexo创建自己的博客，托管到github、Heroku或Coding上，绑定自己的域名，用markdown写文章。本博客即使用hexo创建并托管在github上。

为什么要用hexo

---

不可思议的快速 ─ 只要一眨眼静态文件即生成完成
支持 Markdown
仅需一道指令即可部署到 GitHub Pages 和 Heroku
已移植 Octopress 插件
高扩展性、自订性
兼容于 Windows, Mac & Linux

• 易用。不仅部署简单，平时使用中仅需要hexo new hexo generate hexo server hexo deploy四个命令。不像Jekyll需要很多繁琐的git命令。
• 轻。文件少、小，易理解，方便自定义。
• 用户多。虽然赶不上Jekyll和Octopress，但遇到什么问题都能搜索到答案，或者找到同样使用hexo的用户进行参考和咨询。

谁能使用hexo

---

这是一个免费开源的博客程序，任何人都可以使用和修改。但是不同于wordpress，hexo由于需要使用Github,Git,Markdown,Node.js这样的工具，好多插件、widget都需要自己安装、设置。所以适合那些有一定计算机基础，喜欢折腾的人。但是，不要恐惧，只要跟着本教程走，就能很方便地让自己的博客”飞起来”。

怎样搭建hexo博客

---

正题来了，请认真往下看吧。

---

准备工作

注意 本文主要针对Windows平台和Hexo 3.x
安装GIT
下载 Git 并执行即可完成安装。So Easy

安装Node.JS

---

在 Windows 环境下安装Node.js非常简单，仅须下载Node.JS并执行即可完成安装。So Easy
安装Hexo

---

在任意位置右键，选择Git Bash Here

1  npm install hexo-cli -g
2  #如果命令无法运行，可以尝试更换taobao的npm源
3  npm install -g cnpm --registry=https://registry.npm.taobao.org

---

Hexo初始化配置

创建hexo文件夹

---

安装完成后，根据自己喜好建立目录(如D:\hexo)，在该文件夹下右键–Git Bash Here。执行以下命令

1   hexo init

---

安装依赖包

---

1 npm install

该命令会将hexo所需文件自动下载到hexo文件夹下。

1 #新建完成后，指定文件夹的目录如下
2   ├── _config.yml
3   ├── package.json
4   ├── package.json
5   ├── scaffolds
6   ├── scripts
7   ├── source
8   | ├── _drafts
9   | └── _posts
10  └── themes

安装Hexo插件(可省略)

---

1 npm install hexo-generator-feed --save
2 npm install hexo-generator-sitemap --save
3 npm install hexo-generator-baidu-sitemap --save
4 npm install hexo-generator-json-content --save
5 npm install hexo-deployer-git --save
6 npm install hexo-generator-index --save
7 npm install hexo-generator-archive --save
8 npm install hexo-generator-category --save
9 npm install hexo-generator-tag --save
10 npm install hexo-server --save
11 npm install hexo-deployer-heroku --save
12 npm install hexo-deployer-rsync --save
13 npm install hexo-deployer-openshift --save

查看本地运行效果

---

现在我们已经搭建起本地的Hexo博客了，继续执行以下命令(在D:\Hexo)，成功后即可登录localhost:4000查看效果，运行显示了相关页面，说明当前网站已经在本地建立。

1 hexo generate  #可简写为hexo g
2 hexo server      #可简写为hexo s

好了，至此，本地博客已经搭建起来了，只是本地哦，别人看不到的。下面，我们要部署到Coding。

---

配置Coding

注册Github账号

---

已有账号可以跳过，没有的，请登录Coding进行注册，很简单，这里就不介绍了。

创建repository

---

在自己Coding主页中间上面，创建项目。比如我的Coding账号是MoPoint，那么我应该创建的项目名字应该是mopoint。然后都不用选择，直接点击最下方的创建项目，然后点击左侧的代码，图片，点击，右侧中间的点击这里快速初始化仓库，然后点击下方的启用README.md文件初始化项目，再点击他右侧的创建 。最后我们要创建一个进入页。点击当前页右侧上方的新建文件，22.png,最后点击右下方的提交到master分支。最后一步，点击左侧的Pages服务，再部署来源里面选择master分支，点击保存之后即可访问静态主页如http://mopoint.coding.me/mopoint