为什么是在VPS上搭建,而不是托管到Github?

  • Github的访问速度难以保证
  • VPS灵活度高,且通常可以再部署其它服务,均摊使用成本

为什么是静态博客?

  • 静态博客更省资源

选择VPS

通常在LinodeDigitalOcean两者之间进行选择。

个人选择linode,因为访问速度更快些。

自定义域名

既然部署在VPS上,那么自定义域名是少不了的。在GoDaddyName.com等站点可以进行购买。域名解析选择DNSPod

选择静态博客框架

静态博客框架越来越多,比如JekyllOctopressPelicanHexoHugo等等。

个人选择hexo,hexo的效率还可以,主题比较漂亮。

hexo安装

hexo依赖nodejs,其本身安装很简单,

npm install hexo-cli -g
hexo init blog
cd blog
npm install
hexo server

上面几步操作之后,在本地就创建了一个静态站点,且在浏览器中可以进行访问。

hexo配置

选择主题

hexo是nodejs实现的,js大多是前端人士使用的,因此主题相较其它的框架也更多些。个人推荐KaelNext两个主题。

主题相关配置就参照其说明进行就好,其余基本无需再配置即可使用。

编写文章

在hexo生成的目录下运行,

hexo new [layout] "post name"

就会创建一篇新的文章。随后可以用任意文本编辑器进行编辑。在mac上推荐MacDown编辑markdown文件。

内容发布

因为选择在VPS上部署站点,因此需要将本地生成的文件推送到VPS上去。考虑到数据备份可靠性等问题,内容发布可以分为如下几步,

  • 生成静态文件
  • 将生成的内容提交到VCS
  • 在VPS机器上从VCS拉取生成后的内容

选择VCS托管服务

基本都在GithubBitbucket中进行选择。

个人选择bitbucket,因为可以创建免费的私有库。

编写内容发布脚本

将固定的发布流程脚本化会让写文章这个事情舒服很多,通过Fabric来实现发布脚本,

# -*- encoding:utf-8 -*-

from __future__ import with_statement
from fabric.api import run, local, settings, abort, cd, sudo, hosts, execute
from fabric.contrib.console import confirm

@hosts('localhost')
def add_and_commit():
    with cd('/path/to/local/blog'):
        run('hexo clean')
        run('hexo generate')
        run('git add .')
        run('git commit -am "add content"')
        run('git push')

@hosts('vps')
def update_server():
    with cd('/path/to/remote/server'):
        run('git pull')

def publish():
    execute(add_and_commit)
    execute(update_server)

在写完文章之后,命令行中运行,

fab publish

即可完成生成静态文件、推送到VCS、在VPS上拉取更新三个步骤。命令完成之后,刷新浏览器就可以看到新增添的内容。

VPS上配置Nginx

VPS机器只负责拉取生成后的静态页面,实际对外提供访问还需要通过Nginx

Nginx选择从源码进行编译安装,在ubuntu上的操作如下,

# 准备工作
sudo apt-get install build-essential
sudo apt-get install libpcre3-dev zlib1g-dev

# 下载安装nginx
wget -c http://nginx.org/download/nginx-1.9.2.tar.gz
tail -xzvf nginx-1.9.2.tar.gz
cd nginx-1.9.2
./configure
sudo make install

修改/usr/local/nginx/conf/nginx.conf,添加如下内容,

server {
    listen       80;
    server_name  http://your-custom-domain;

    location ~ ^(.*)$ {
        root  /path/to/hexo/public;
        index index.html;
    }
    error_page  404  /404.html;
}

这里指定了404页面,404.html页面放置在blog/source/目录下,内容可以考虑使用公益寻人页面,

<!DOCTYPE HTML>
<html>
<head>
  <meta http-equiv="content-type" content="text/html;charset=utf-8;"/>
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  <meta name="robots" content="all" />
  <meta name="robots" content="index,follow"/>
</head>
<body>

<script type="text/javascript" src="http://www.qq.com/404/search_children.js" charset="utf-8" homePageUrl="http://your-custom-domain" homePageName="回到我的主页"></script>

</body>
</html>

总结

在VPS上部署站点需要的内容比将站点托管在Github上要复杂,但也相对更为灵活。类似Nginx之类配置又往往是VPS上的基础性配置,所以实际而言也并没有增加太多工作量。

在所有可能的地方进行自动化这一点依然需要牢记,将重复的事情丢给机器去做。