个人Blog运行的原理
由于博主并非专业的CS专业大神，所以开始时也是摸着教程起手。但是博主发现目前大多数教程主要是针对实现一个结果的步骤教学，或者说“所见即所得”，在入手初期效率很高。一个门外汉（以博主为例）也能很快的搭建出一套可以用的环境。但是在后期，遇到问题或者想要客制化实现某些theme的特定功能时很可能不知如何下手。博主本人在初期就吃了这个亏导致一直浑浑噩噩不知道原理。所以本篇文章博主打算首先介绍一下整个Blog实现运行的原理。如果比较急着看到教程的读者也可以直接跳至第二节。 想要先看看效果的可以浏览博主的个人Blog。
利用Hexo撰写博客，并从本地部署至Github
博主在大学苦受C艹折磨，之后对于编程打心眼儿里的怕。度娘一搜如何搭建网站的教程。看看Html这些玩意儿感觉基本上可以收拾收拾睡了。但是后来很走运看到了柏荧的博客搭建教程，虽然博主最终的Blog搭建和BY大神略有不同，但还是从这里获取了很多启发。再继续的收集信息之后发现有一些神奇的东西可以让你专注与文章的写作，而不用花费大量时间在html的构建上。这些东西就是博客框架，常用的博客框架有Jekyll，Hexo，Simple，Octopress，Pelican以及Lo·gecho等等。这些框架之间的优劣对比在网上有很多的文章，在此博主不去赘述（主要因为博主自己也不懂。。。。）。 至于博主最后的选择则是Hexo。如果硬要问原因是什么的话，博主只能说Hexo的theme普遍比较好看（毕竟好看是第一生产力），同时支持Markdown语法。最后还有很重要的一点就是Hexo的文档十分友好（是那种连博主都可以看的懂的文档，可以说是十分的良心了）。
拥有了Hexo之后，你会发现整个的写Blog的过程变得十分轻松友好且高效，个人只需要掌握很少量的命令就可以很轻松的实现html文件的实现。而这一切都只发生在你个人的电脑上，也就是本地。意味着你写的一切到目前为止都只有你自己一个人能看到（那还要个 的html），所以下面就要介绍如何把我们的Blog推向星辰大海——部署至Github。
利用Github进行代码托管
为什么是Github
免费且高效
第一 免费
说到GitHub，连博主这样的菜鸡都听说过其作为一款免费开源的软件托管平台的大名。使用这样一个开源平台来托管个人博客这种非盈利性的网站的代码对于各个博主来说都是比较合算的。
第二 高效
Github在创立repo的时候就会自动的为你创建一个静态页面。而静态页面虽然可能有些交互的功能难以实现，但是对于一个个人博客来说，完全足够。并且静态网页的内容相对稳定，因此容易被搜索引擎检索，阅览速度也十分迅速。同时作为一个出名到爆的开源平台，GitHub上有各路大神大牛，你几乎可以找到所有你希望实现功能的库和代码，快速高效的达成优化网站的目标。
GitHub的作用
正如上文所说的，GitHub对于Blog来说，就相当于一个繁华商业街上的展柜，这个展柜负责帮你将你想要卖的东西从深山老林里面拉出来再放在店里。毕竟如果没有互联网的话说不清大清到底亡还是没亡。
至此就是整个Blog运行的原理，虽然其中还有很多细节值得进一步讨论（很多是博主自己瞎猜的，不过用来理解到目前为止没出过什么特别不能解释的地方），但整体的框架是搭出来了。如果还用不太明白的读者可以再看一下下面的流程图。看完我们就开始正儿八经的教程了。
Blog环境的初步配置
注册Github，创建Repo
正如之前所说的，我们需要一个GitHub的Repo来充当展柜的作用，第一步如果没有GitHub账号的朋友需要去注册一下，注册完之后就可以开始创建我们的Repo。
在Repository name中写yoursitename.github.io，例如博主的就是zhenyuwei99.github.io（有教学贴提过yoursitename需要喝用户名相同，博主没有尝试使用其它的sitename，有兴趣的话读者可以尝试一下）。这个地址最后就是你的Blog的展柜，但同样的你也可以选择自己购买自己的域名，比如博主的madwayne.com，至于如何配置个人域名超出了本篇文章的讨论范围，博主将会在后续的文章中进行讨论。
这个时候你可以打开Repo中的Setting，在这个位置
再找到GitHub Pages
你可以看到有这样一句 “Your site is published at yoursitename.github.io” 这里因为博主配置了自己的个人域名所以没有显示本身的网址。你可以点开链接，看一下自己未来几百篇文章将会放置的地方。当然现在这个时候用的是GitHub自带的theme，毫无美感可言，不过已经已经完成了这一阶段的任务，后面就要靠Hexo来进行网站美化以及文章撰写工作了。
优雅的敲Hexo
如上文所说的，Hexo的文档十分友好，而且是有中文版本的（由于博主电脑自设的是English导致一直搜到的网页都是英文版，弄完了才发现有中文版。。。。），读者可以自行阅读文档进行环境的配置，博主在此不再赘述。下面主要说明如何优雅的在本地进行文章的写作。
编译器的选择
博主本人之前一直习惯于Latex写作，所以一直用的是Submile text 3进行编译（主要是没有遇到现在用的，Atom也可以编译Latex）。看过Hexo文档的读者会发现Hexo需要常常用到terminal敲命令，而进行窗口的不断切换实在不是一件令人舒适的事情，而在看Hexo文档中自带的视频的时候，我发现作者所用的一个编译器可以自带terminal，翻边了YouTube评论才知道编译器的名字叫Atom，官网在此，发现也是GitHub的产业（嗯，GitHub大法好）。
下载安装就完事儿了。Atom相较于其他编辑器在于其丰富的可扩展性，你可以在上面获得各种各样你想要的package来实现特定的功能，正如在首页所说的：“A hackable text editor for the 21st Century”。当然还用最重要的一点就是颜值很高，theme也有很多选择，下面仅介绍一下我的选择以及package的配置。
Theme的选择
Atom自带四种Theme，同时也有很多别的大神设计的theme可以使用，博主在这里使用的是比较有名的 Atom Material Ui，博主写文章时候的工作效果如下。
Theme的初始状态并不是现在这个样子，需要在Theme的Setting里面将 Tinted Tab Bar 选项打开
Package的配置
这篇文章博主只想谈一下用来使用Hexo所需要的Package，其他的功能（例如博主也会用Atom来写Latex和C艹将来会在别的文章中详细说明）
1 PlatformIO IDE Terminal
这个Package是博主本人转向Atom的主要原因，如上文所说的，Hexo使用过程中经常需要使用Terminal来敲命令，切换实在麻烦，这个Package的作用就是在Atom里添加一个Terminal的窗口，十分的好用。效果如下。
2 atom-beautify
这个Package的作用时对代码进行自动的高亮以及排列，对于强迫症患者来说可以说是很好用了，同时他也支持很多不同的语言，根据作者的介绍包括HTML, CSS, JavaScript, PHP, Python, Ruby, Java, C, C++, C#, Objective-C, CoffeeScript, TypeScript, Coldfusion, SQL等等。
Hexo使用的一些问题
1 Hexo更换Theme
在Hexo的官网中可以找到很多颜值很高的Theme，博主所选择的是比较成熟的Next。原因在于其比较成熟，同时用于用户量很可观，寻找解决问题的方案也很方便。本文以此为例展示如何为自己的网站改变主题。
首先找到Next的文件库，在Hexo中点击文字（点击图片的话是预览效果）找到Theme的Repo，复制链接
这个时候在用Atom打开你自己存储Blog文件的文件夹，打开terminal,输入以下命令：
$ cd themes
$ git clone "siteoftheme"
clone theme的Repo。
下面开始配置_config.yml文件,注意这里要区别站点配置文件以及主题配置文件。这里首先是在Blog文件里的站点配置文件，用于调用网站配置所需要的文件。
在文件中找到theme这个选项，将其改为themes文件夹中clone获得的文件夹名，注意.yml文件 :后需要一个空格，否则不识别。
2 Theme的客制化
首先找到theme的配置文件，具体路径应该是 \"blogfolder"\themes\"themename"，通过更改其中的内容可以获得相应的效果，Next比较成熟可以很方便的添加插件实现很多功能，其中的注释也很详细。虽然是英文只要读者耐下心读基本可以理解使用方法，同时推荐Hexo的Next主题详细配置这篇文章，或者也可以看Next使用文档，基本上可以解决所用问题。如果读者还遇到了无法解决的问题，欢迎email博主一起讨论。
部署本地代码
这个时候，我们已经完成了进入展示柜前的所用工作，我们已经很优雅的完成了文章的写作同时也生成了产生网页所需要的html文件，下一步我们只需要将这些本地文件部署至GitHub就大功告成了。
直接网站上传
打开GitHub中的Repo，直接点击Upload files上传文件。
这种方法比较简单，但是没有利用好Hexo。
利用Hexo上传文件
Hexo提供了十分便捷的一件部署方案，$ hexo deploy或者$ hexo d。为了使用这个功能首先需要安装hexo-deployer-git。
在 terminal中输入：$ npm install hexo-deployer-git --save
安装完成后修改站点配置文件：
deploy:
type: git
repo: #https://bitbucket.org/JohnSmith/johnsmith.bitbucket.io
branch: [branch] #published
message: [message]
需要注意缩进的问题，deploy后的每一行需要缩进相同。
上述所需要更改的主要是repo和branch选项，repo即为放置Blog文件的库的地址，branch一般直接master即可。至于message选项博主也没弄懂有什么用，缺省影响不大。更详细的信息读者可以参看Hexo文档中部署一节。
结语
至此我们就已经完成了Blog的初步搭建，同时为大家大致梳理了一下个人Blog的运行原理，希望对大家有所帮助，后面博主也会更新一些我自己摸索的更加有意思的东西。至于各位将一部分的人生花在观看一个无聊的SB写的十分啰嗦的文章上，博主在这谢谢了。