写在前面的废话

这是我刚搭好的博客，可以看看样子 zander2014.github.io/

大家好，我是一个小马农，相信大家在打开我这华丽的博客时，就已经迫不及待的想问"哥，这是怎么弄的，太炫了，花了多少钱？我也想整一个。"

别急嘛大兄弟，今天你既然来了，哥也知道你的心思，这就慢慢的给你道来，这个炫酷的blog不花一分钱，动动手指，你就拥有。

关于Github Pages

就是这个啦，Github Pages，我们用它提供的服务来搭建自己的博客，它就相当于一个免费的服务器。

好处：

完全免费、不需要维护、随意DIY主题，默认Https，可绑定自己的域名，总之简单的操作之后，你只管写你的文章就好。
限制：

仓库（也就是你的网站）不要超过1G，不要频繁提交更新（<=10次/小时），每个月带宽上限100G。总之作为一个小型个人博客来说完全够用，如果不够用，那么恭喜你已经小有成就，花点钱自己搭建的服务也是小case了。

关于Jekyll

有了服务器，我们用什么来写自己的blog界面呢？以前用过WordPress或者其他前端框架的都知道，要有一个框架来写，要不然自己纯手工造轮子有多麻烦。

当当当当！Jekyll就是这样一个框架啦，可以去官网(中文/English)自行学习如何搭建环境、创建网站、寻找模板资源等等。

好处：

Github Pages原生支持的框架，生成的是纯静态网站，上手简单，出问题会少一点，解决问题也会快一点。除了官网的资源外，还可以在Github上找到很多开源的模板（怎么找？当然是搜关键字找啦！每个人的口味都不一样，我就不举例子了）。
限制：

其实也没什么限制，就是官网的模板说实话，风格偏国外风，想挑出几个能接受的还真不多，当然我们也可以选择其他静态模板框架，比如Hexo、Hugo、Pelican、Gridea，使用方法可以参考官方的，也可以自己搜一些博客学学，再或者找一些H5模板也可以。

关于NexT

NexT，就是我这个网站选择的一个Jekyll的模板，它之前有hexo的版本，后来改写了Jekyll的版本，这个模板的风格相信大家现在已经看到了，话不多说，想自己搭建的就去官方教程看看，剩下的人，跟我走。

开始搭建Blog

登录github

什么？你还没有这个大型同性交友网站的账号？没有注册过的同学抓紧去官网注册，并登录。

有关注册时相关信息的填写，以及登录后个人信息的补全，就不一一介绍了，相信每天上网的你们，都开始要搭建自己的博客了，这些流程已经烂熟于心了。

新建Repository

选择New repository

页面右上角有个"+"号，点击后在弹窗中选择New repository
填写Repository name

**注意：**填写1处的Repository name，格式为xxx.github.io，xxx就是你的用户名，比如我的就是Zander2014.github.io，xxx必须和你的用户名匹配，也就是说，一个账户只能在Github上创建一个blog仓库。

然后点击2处的Create repository按钮，仓库就创建成功了。

进入Setting设置GitHub Pages

不出意外的话，界面会自动跳到你的仓库首页，此时选择Setting界面。
然后往下翻，会看到GitHub Pages，点击Choose a theme
进入主题界面，选择一个自己喜欢的主题（其实没几个主题，相信你都不会喜欢，先随便选一个看的过去的吧一，后面再替换自己喜欢的模板），点击Select Theme
随后跳转到一个界面，然后往下翻，点击Commit changes

查看Blog

到此你的网站就搭建好了，直接访问你之前填写的地址就好了，比如我的zander2014.github.io

然后在自己的Github->Code界面写自己的文章就好了

此处只是一个讲解的例子，便于理解github上文件是什么回事，可以跳过

比如我点击Add file，这里可以选择直接创建(Create new file)或者上传文件(upload files)，我选择直接创建一个，会跳到一个编辑界面，
然后随便写点东西，起名test.html，文件内容支持markdown文件格式（md规则需要自己学习一下，也可以下相关软件，操作更方便），点击页面下面Commit new file按钮，回到首页，看见多了一个test.html的文件
此时我们在浏览器访问zander2014.github.io/test.html

大概知道是什么意思了吧，GitHub->Code界面，就是你Zander2014.github.io的根地址，默认会访问index.md，剩下的就是你怎么创建文件的目录结构，怎么访问就好了。

网站同步

手动创建上传文件，我们会怀疑人生的，而且还没办法控制版本，所以我们需要借助版本控制工具去管理，其实就是用Git，对Git不熟的同学快去官网，或者大神的网站去学习。

那么操作方式也有两种：

命令行（需要先安装好git环境，然后在终端使用git命令，大神一般都用这个）
客户端（也就是图形界面的方式管理命令，小白一般都用这个）

命令行方式

打开Terminal(终端)，进入你自己想存放网站的目录（比如我就在我的用户主目录）
新建一个目录，用来存放我的网站仓库（比如我创建一个blog），进入blog目录
克隆我的网站仓库到blog目录点击Code按钮，弹框中2处，可以切换使用https还是ssh的方式，然后点击3处的图标复制地址。

因为ssh涉及到创建密钥和添加密钥的一些步骤，我们就使用https的地址，使用简单，git clone https://github.com/Zander2014/Zander2014.github.io.git
在我们克隆好的目录中，我们可以创建文件，提交文件等等，主要用到的命令无非就是下面几个：

git add（添加文件到本地仓库）

git commit（提交文件到本地仓库）

git push（推送本地仓库文件到远程仓库，也就是传到github上）

git pull（从远程仓库拉取文件到本地仓库）

客户端方式

官方客户端 https://desktop.github.com/

其他客户端，比如[Sourcetree](https://confluence.atlassian.com/get-started-with-sourcetree/)等。

这些客户端都有图形界面，有入门教程，很简单，照着学一学就会了。

安装NexT

确保已安装Ruby 2.1.0 或更高版本：
```
$ ruby --version
```
如果没安装过，使用homebrew去安装，执行brew install ruby

如果homebrew安装很慢的话，可能是资源的问题，使用镜像资源会快很多，使用方法
安装Bundler：
```
$ gem install bundler
```
如果报错

ERROR: While executing gem ... (Gem::FilePermissionError) You don't have write permissions for the /Library/Ruby/Gems/2.6.0 directory.

这是权限问题，我们可以直接在命令前加sudo，sudo gem install bundler
下载 NexT 主题：
```
$ git clone https://github.com/Simpleyyt/jekyll-theme-next.git
//可以用命令clone到本地，也可以直接下载项目
```
因为我们已经创建好了自己的仓库，所以我们把下载好的NexT资源，全部拷贝到我们的仓库目录中去，拷贝到同级，会覆盖之前的一个_config.yml文件，选择替换，也就是像下面这样，

然后进入我们的仓库目录
```
$ cd Zander2014.github.io
```
安装依赖：
```
$ bundle install
```
运行 Jekyll：
```
$ bundle exec jekyll server
```

此时即可使用浏览器访问 http://localhost:4000，检查站点是否正确运行。

之后把代码提交到远程GitHub仓库，就可以在浏览器输入zander2014.github.io看见了

如果需要使用其他模板的话，每个资源都有他们的使用方法，具体参考模板的教程就可以了，大致流程一样，下载资源、替换资源、运行就好了

写Blog

现在你只需要找一个趁手的 Markdown 编辑器：Typora、熊掌记、印象笔记、zen、有道云笔记、Ulysses。

在电脑上编辑你的文章，然后放到仓库项目中的 _posts 文件夹里，并使用前面提到的两种方式将文章同步到 GitHub 上即可。

注意：

**文件格式：**年-月-日-标题.markdown
文章内容顶部：必须有下面的 YAML 头信息：
```
---
layout: post
title: Blogging Like a Hacker
---
```

使用GitHub搭建自己的Blog