“授人以渔”般教你搭建个人独立博客
——使用jekyll在GitHub Pages上搭建个人博客
网上有不少资源，但大多是“授人以鱼”，文中一步一步的告诉你怎么做，却没有解释为什么，以及他是如何知道的。他们默认着你知道种种专业名词的含义，默认着你掌握着特定技能。你折腾半天，查资料，看教程，一步步下来，有进行不下去的地方，再去查其他人的做法，最终也建立起了自己的独立博客。但却，恍然不知，你用到的技术是什么含义。
我认为，初学者，要想在一个项目中，切实提高自己，需要活用活学。遇到一个专业名词，就去搞懂它，而不是马马虎虎混过去。一个技能点、一个技能点的攻破，然后将点系统的连起来，形成自己的知识网络，不断去细化和扩充。所以，这篇文中，尽力的在“授人以渔”。读者边看边实践之后，一方面，可以搭建好自己的独立博客；另一方面，会学到涉及的知识。前者是实际应用，是至顶向下的过程；后者是基础知识，是自底向上的过程。至底向上与至顶向下相结合，才能融会贯通。我希望在文中表达的,或者说希望读者接收到的，也就是融会贯通的学习能力。
目录
引子
Step 1. 选地
注册Github，新建仓库，新建GitHub Pages，克隆到本地。
1.1. 什么是Git和GitHub? 分布式版本控制系统，代码托管，开源项目。
1.2. 什么是GitHub Pages？
介绍用的Blog
1.3. 如何使用？
Step 2. 建造
安装Jekyll环境，运行本地服务器。
2.1. 什么是Jekyll？ 静态网站生成器
2.2. Jekyll文件目录
2.3. 如何发表文章？
Step 3. 装修
选择模板，下载，安装。
3.1. 如何选择和修改主题？
Step 4. 定制
4.1. 如何使用独立域名？
4.2. 如何添加评论功能？
最后
不要忘记初衷，在折腾之后，表达写作，才是最重要的事情。
参考
正文
引子
在互联网的世界里，建自己的博客就像是在搭建房子。当然，你可以直接用别人为你建好的房子，比如Tumblr、简书、新浪博客、Lofter、博客大巴等等。
Tumblr和Lofter都是自己比较喜欢的，房子建得美丽又实用。在同一个平台下，就感觉你们在同一个社区。当然不是这个社区居住的人们，也是可以进来逛一逛的。简书，也是如此。顺便提一句，选择简书，是喜欢它的写作体验。
不过，有时候，你想从头到尾自己建房子，就是搭建个自己的独立博客。如果你不知道如何选择，可以读一读《What are the best solutions for a personal blog?》（需翻墙），文章分析了不同博客平台的优缺点和针对人群。当然，我的选择是 Jekyll+Github Pages。
开辟土地、搭建、装修、到注册门牌号等，都是需要动手的。土地就是你的服务器，房子是你的网站，装修是网站主题，布局和色彩等等，当然门牌号就是你的域名了。别忘了你还要写文章，这才是关键，你房间里放的不是家具，而是你的思考成果。
话不多说了，我们开始建房子的美妙旅途吧 ；）
Step 1. 选地
互联网上有免费的地，也有收费的地。Github Pages就是一个免费好用的地。
具体步骤：
- 首先，注册 Github
GitHub.jpg -
然后，建立一个仓库
NewRespsitory.png
Repository name(仓库名)必须是 your_user_name.github.io
比如，我的用户名是Yogayu，那么仓库名就取为 Yogayu.github.io。这一点很重要，不要弄错。
-
最后，按照提示步骤操作
QuickStep.png
一种简单的方式是，下载GitHub的桌面客户端，安装完成后，粘贴
http://github.com/your_user_name/your_user_name.github.io.git 克隆到本地。
- 之后，新建一个index.html文件，push到对应的master
分支（推荐官网教程）。等一段时间之后（可以听首歌），网站生效，访问your_user_name.github.io，就能看见完整的网页了。
firstIndex.png
到此，我们的地就选好了，也就是在用GitHub的服务器。
若这一过程中有问题，可以参照官网文档
1.1. 什么是 GitHub？
在说GitHub之前，必须要提到Git。Git是分布式版本控制系统。GitHub可以托管各种Git版本库，并提供一个web界面。
Github 就像是程序员们的Facebook，程序员们，写代码，做项目，在此和全世界的人们分享。
会使用GitHub的资源，比会搭建个人博客的价值大得多。
1.2.那么GitHub Pages是什么呢？
Website for you and your project.
GitHub Pages有两种。一种是为个人或者组织的博客。一种是为项目的博客。前者一个账号只能建一个，后者，可以建很多个。
这样的博客，免费、独立、安全。
1.3. Git和Github如何使用？
可选择终端或图形化界面操作。怎么顺手怎么来吧。
Step 2. 搭建
环境搭建。
- 安装Ruby，Mac一般默认安装了Ruby，这一步可以忽略。官网安装
- 安装Bundler，在Terminal中输入：
gem install bundler - 安装Jekyll，同理输入：
gem source 'https://rubygems.org'
gem 'github-pages'
*当然，如果你在墙内，很容易出问题，无法安装，推荐修改镜像源（淘宝镜像源）。 - 安装Jekyll
gem install jekyll
在你希望存放的目录下，输入：
jekyll new your-site-name
进入：
cd your-site-name
运行本地服务：
jekyll s
在浏览器中输入：
http://localhost:4000
就可以在本地进行查看和调试你的网站了。
2.1. 什么是Jekyll？
Jekyll is a simple, blog-aware, static site generator.
Jekyll 是一个简单的博客形态的静态站点生产机器。
解释一下，Jekyll可以将纯文本转换为静态博客网站。你整个网站的页面都是它生成的，从主页index到文章post。
比如，文章怎么写？标准网页格式是扩展标记语言HTML。纯手写？未免太麻烦。大家，多偏爱Markdown。所以，就用它写。不过，你需要有一个能把你用Markdown格式写的文章，转化为HTML网页的东西，这里使用的就是静态网页生成器。
静态网页是相对于动态网页而言的，如果感兴趣可以自己学习。
2.2. Jekyll目录
解释一下整个jekyll的目录(官方文档):
为了之后不至于完全茫然，很值得先看一看，第一次看不懂没关系，用着用着就知道什么意思了。就像练习吉他和弦的转换，开始很难，可换着换着你就会了。
这个很奇怪的结构是，文件目录树，_config.yml这样的代表一个文件，_drafts这样的代表一个文件夹，与它连接的文件，比如begin-with-the-crazy-ideas.textile，就在文件夹中。一开始，我没怎么看官方文档，嫌麻烦，不如直接开始干。结果是绕了不少弯路，修改主题的时候，找半天各个部分。
先说需要了解的，其余以后依个人需求学习。
- _config.yml 是配置文件，你可以在里面配置你博客会用到的常量，比如博客名，邮件
- _includes：就是你文章各个部分的html文件，可以在布局中包含这些文件
- _layouts：存放模板。就是你网页的布局，主页布局，文章布局。当然不是指CSS那样的布局，是指，你包含哪些基本的内容到页面上。包含的内容就是includes里面的文件。
- _posts: 存放博客文章
- index：博客主页
- CNAME文件：域名地址
- CSS：存放博客所用CSS
- JS: 存放博客所用JavaScript
可以设置每个html文件的title(标题)和layout(布局)。比如index的layout一般是default。你也可以添加其他的页面，加上不同的layout。
当你想定制博客的时候，以上目录就很有用了。
2.3. 如何发表文章？
文章的写法，在Markdown开头加上一段：
---
layout: posttitle: "Welcome to Jekyll!"
date: 2014-01-27 21:57:11
categories: Blog
---
文件命名格式: 时间加标题
比如：2015-08-15-HowToBuildBlog.md
ok，你可以写文章了，放入_post文件夹即可。
Step 3. 装修
3.1. 如何选择和修改主题？
- 一种方式是使用程序员们写好的，免费开源。
推荐两个超级丰富的资源
- 另一种是，你也可以自己写或修改，需要懂一些前端的知识。
之前，我在Codecademy上学了两、三天，进行入门。正好用自己的博客，来做练习。
其实前端还蛮好玩的，特别满足强迫症的强迫意愿。
推荐资源：
- 基础学习：Codecademy
- 框架: Bootstrap
虽然下了dreamweaver, 没怎么用，不过官网上的教程不错。 推荐使用 Sublime Text, 多么好用的代码编辑器啊，还有一个不错的教程。再配上Jekyll的本地服务器，在Chrome上调试。那感觉~
自己写是好，也要看看别人是如何做的，优秀的网站是如何设计的。文章可以注重注重排版，字体选择，屏幕适配调整等。不过说实在的，个人博客最重要的还是你的文章内容。
Step 4. 定制
如果你已经做到了这一步，那么恭喜你，你的个人博客已经搭建完成。不过要享受折腾的快乐，或想要更好的独特性，就继续进行吧。
4.1. 如何使用独立域名？
- 购买域名 著名的有 Godaddy，支持支付宝。在网上可以搜到优惠码。
在你本地网站文件夹中添加一个文件 CNAME，写入你的域名即可。
考虑到我国网络特殊情况，进行域名解析，可以选择Dnspod
添加两条A记录(教程)，对，就是计算机网络课上学的A纪录。在你的Godaddy上看你买的域名，就能找到，两条A记录。
买域名这事，我自己还有点经历。一开始我买了个azureyu.cn的域名，cn是国内的，然后让提交身份证信息，输入各种资料。又要进行网站备份，一大推看不懂的备份名词，最后放弃了。买了个国外的域名azureyu.com，没有了以上复杂环节，马上就可以用了。 （现在换成data2art.com啦。）
4.2. 添加评论
这些平时习以为常的东西，到这都是纯手工制造。
我使用的是Disqus
- 注册Disqus
-
在博客中添加，就会自动获得它为你生成的一段代码，复制它
add.png
- 新建一个名为Comments的html文件，复制进去这段代码，保存到文件夹_includes里去。然后在_layouts的post文件里加入：
其实，就是在你的网页中加入一段代码，加载之后在网页中加入Disqus，就会自动获得它为你生成的一段代码。
要还想添加一些feature就去折腾吧。比如分享、文章目录、代码高亮、标签云、搜索等等。我想到现在，学习这些内容，对你已经很简单了。
最后
个人建议：
- 多看官方文档，系统清晰很多
- 利用好而不是滥用搜索引擎
- 遇见问题，先看看他人如何解决
用一句作为结束：
不要忘记初衷，在折腾之后，表达写作，才是最重要的事情。
参考：
- http://www.ruanyifeng.com/blog/2012/08/blogging_with_jekyll.html
- http://beiyuu.com/github-pages/
- http://daringfireball.net/projects/markdown/
- http://stevelosh.com/
- http://jekyllbootstrap.com/
- http://gaohaoyang.github.io
- http://segmentfault.com/a/1190000000406013
- http://tom.preston-werner.com/2008/11/17/blogging-like-a-hacker.html
- http://jekyllbootstrap.com/usage/jekyll-quick-start.html#toc_0
作者「[AzureYu]」
文章声明：自由转载-非商用-非衍生-保持署名 | BY-NC-SA
