搭建个人网站之路

Posted on

看到阮一峰大神的2012中的Blog中有着一段：

第一阶段，刚接触Blog，觉得很新鲜，试着选择一个免费空间来写。
第二阶段，发现免费空间限制太多，就自己购买域名和空间，搭建独立博客。
第三阶段，觉得独立博客的管理太麻烦，最好在保留控制权的前提下，让别人来管，自己只负责写文章。

自我感觉了一下，昨天才建立好自己的blog，第一阶段的孩子兴致冲冲想来写一篇blog，这不，刚好可以写写怎样使用github Pages和Jekyll建立一个免费的个人博客网站。

github Pages和Jekyll介绍

我们都知道github是一个代码托管网站，从个人到大公司都可以将开源项目放在上面托管，简直就是程序员们的天堂，妈妈再也不用担心我代码写不出来了。但是如果紧紧是代码放在上面，没有交流讨论，开源就失去了它的价值了，而想要交流就必须先了解，因此除了README文件之后，github还推出了github pages项目。通过github pages项目可以将项目内容通过正常的网页展示，并给出一定的介绍，相当于代码和人类思维之间的润滑剂，让你可以在不看完代码之前可以对项目功能，各部分作用之间有一定了解。由于gitgithub pages给你pages允许用户自定义项目首页，用来替代默认的源码列表，所以，github Pages可以也被认为是用户编写的、托管在github上的静态网页,并且有意思的一点是，你的源码传上去之后，github可以内置的模板解析网页，也可以不使用内置的，而使用Jekyll生成网页再展示。

Jekyll（发音/‘dʒiːk əl/，”杰克尔”）是一个静态站点生成器，它会根据网页源码生成静态文件。它提供了模板、变量、插件等功能，所以实际上可以用来编写整个网站。当然现在静态站点生成器还有比如Hugo，Hexo等。

说人话就是，如果把搭建blog比喻为唱戏，那么github pages给你提供免费的场地，而Jekyll给你提供唱戏所需要的戏台，给你服装，而你只需要专注于唱戏，也就是写blog。

使用github pages。

那么首先我们要先找场地。首先在github上创建一个项目，如果你在github上的ID为abc,那么创建一个abc.github.io的项目。比如：github_pages
我的ID为linshengli，因此创建了一个linshengli.github.io的项目，然后，设置该项目的github pages:setting->github pages中设置source为master branch。github_pages_1至此，我们已经将github pages的大半事情做好了，接下来，你可以进入abc.github.io，看到的大概是github_pages_2至此，大概可以理解为戏台已经搭建好了。

使用Jekyll生成器

接下来我们来准备写blog需要的一些其他东西。因为我们的blog肯定是使用文本编辑器在本地写好之后，推送到github的仓库中去，然后，github的Jekyll生成器根据我们项目文件生成我们的blog的网页。而比如说blog的功能，样式，我们都可以通过Jekyll的非正文内容配置得到。

博客主题

博客的主题和功能必定为大家很在意的一点，这些我们都可以通过下载适当的Jekyll模板实现。推荐一下主题：

在找到一个理想的主题之后，首先我们将我们创建的仓库和喜欢的主题clone到本地：

1
2
git clone XXXX.github.io[你的项目地址]
git clone XXXX.github.io[你喜欢的主题]

可以看到Jekyll主题的项目结构是这样的：

1
2
3
4
5
6
7
8
9
10
11
12
13
├── index.html
├── _config.yml
├── assets
│   ├── blog-images
│   ├── css
│   ├── fonts
│   ├── images
│   └── javascripts
├── _includes
├── _layouts
├── _plugins
├── _posts
└── _site
  • _config.yml:是我们的配置文件，决定了 Jekyll 如何解析网站的源代码。
  • _layouts:这个目录存放着一些网页模板文件，为网站所有网页提供一个基本模板，这样 每个网页只需要关心自己的内容就好，其它的都由模板决定。
  • index.html:是网站的首页，访问 http://username.github.io时，会指向http://username.github.io/index.html。
  • _posts:这个目录存放我们的所有博客文章。

书写Blog

然后，你就可以在_posts中新建文件blog书写了，完成之后，将所有文件上传到github上

1
git push origin master

之后，再访问abc.github.io,就是你的blog了。

参考文章