Set Up Jekyll on Your Own VPS

Set Up Jekyll on Your Own VPS

blog

Update: 博客已经从Jekyll换到了Bludit，又换到了现在使用的Ghost。

什么是 Jekyll

Jekyll is a simple, blog-aware, static site generator perfect for personal, project, or organization sites. Think of it like a file-based CMS, without all the complexity. Jekyll takes your content, renders Markdown and Liquid templates, and spits out a complete, static website ready to be served by Apache, Nginx or another web server. Jekyll is the engine behind GitHub Pages, which you can use to host sites right from your GitHub repositories.

Jekyll 是个静态网站生成器, 比起 WordPress 等博客软件, 它显得更加轻巧, 硬件要求比较低, 这个 blog 就是架设在 [Bandwagon] 148MB内存 VPS 上面的, 之前想在这上面安装 [Ghost], 可能是 VPS 配置太低了, 一直是编译错误, 安装不上, 只好放弃.

大多数人买这家 VPS 来做爬墙梯子, 因为它内置了Shadowsocks 一键安装工具. 不知什么原因, 开了 Shadowsocks 后, 博客访问不了了, 没去仔细研究, 索性就删了 Shadowsocks 了, 反正在墙外, 梯子需求不是很强烈.

扯了有点远了, Jekyll 博客可以直接使用 [Github Pages]来实现, 我没有试过, 因为喜欢全面控制自己的内容, 所以托管在 Github 上面还是有点介怀. 再者, Github Repository 是公开的, 这就有关于隐私方面的原因了. 最后, 生命不息, 折腾不止哈.

安装 Jekyll

参考 Jekyll 的[官方文档], 里面有4个要求.

Ruby (v1.9.3 or above for Jekyll 2 and v2 or above for Jekyll 3)

一般 VPS 都自带 Ruby, 使用下面命令检查 Ruby 版本

ruby -v

没有的话, 自己安装

yum install ruby
# apt-get install ruby-full (Ubuntu)

一般软件库里面的 Ruby 版本比较旧, 是 v1.9.*, 如果使用 Jekyll 3的话, 要自己升级 Ruby 版本. 可以选择如 [RVM] (Ruby Version Manager) 之类的工具来升级, DigitalOcean有个关于RVM使用的[教程].

# Install RVM
\curl -sSL https://get.rvm.io | bash -s stable --ruby
# 查看可以安装的 Ruby 版本
rvm list known
# 安装高级版本的 Ruby (ruby_version > 2.0)
rvm install ruby_version

RubyGems

#下载 RubyGems
wget https://rubygems.org/rubygems/rubygems-2.6.6.zip
#解压
unzip rubygems-2.6.6.zip && cd rubygems-2.6.6
#安装 RubyGems
ruby setup.rb

如果之前安装了 RVM 的话, 安装会简单一些.

rvm rubygems current

NodeJS

curl --silent --location https://rpm.nodesource.com/setup | bash -
yum -y install nodejs

Python 2.7

这个就不要说了, 基本所有的 VPS 都满足这个条件.

安装好上面的环境后,下面到了安装 Jekyll 的时间了, 很简单, 就一句

gem install jekyll

配置 Jekyll

官方默认设置

~ $ jekyll new myblog
~ $ cd myblog
~/myblog $ jekyll serve
# => Now browse to http://localhost:4000

下面是以上命令的输出, 可以看出其实 Jekyll 静态生成只有一个文件夹 _site.

然后你就可以通过访问 [http://127.0.0.1:4000] 来进入你的博客, 但这个针对的是本地配置的 Jekyll 博客, 如果是在 VPS 上面生成的话, 以上地址是访问不了的, 你需要配置 Web Server, 然后把 _site 文件夹下所有文件放到 Web Server 的 html 目录下, 就可以通过 VPS 的 IP 地址公开访问你的博客了.

就跟WordPress一样, Jekyll 也有自己的主题, 一般来说默认主题也够用了, 当然不是每个人都满足于默认主题的, 本博客用的是 amplify 主题.

日常使用到的文件/文件夹是 _config.yml 和 _posts,  _config.yml 下面是整个网站的配置, 例如个人信息, 网站域名之类的. _posts 下面就是你要写的文章了, 所有文件都是以 .md 结尾的 Markdown 文件. 这里要注意的是 Jekyll 对 .md 文件命名有要求, 是日期加上博客题目, 本篇博客文件的名字是 2016-07-11-Set-Up-Jekyll-on-Your-Own-VPS.md. 文件名字中的题目不一定是 permalinks 中的题目. 这篇博客的 URL 是 [https://luohuan.me/2016/07/11/Set-Up-Jekyll-on-Your-Own-VPS.html], Permalinks 的设定和博客的   [Front Matter] 有关, 这篇博客文件也可以保存成 2016-07-11-hello-world.md, 只要文件开头的内容保持一致就可以, URL 是不会随文件名改变的. 本篇博客的 Front Matter 如下:

---
layout: post
title: Set Up Jekyll on Your Own VPS    
tags: vps,jekyll,blog,nginx,ruby,rvm
---

以后要写新文章, 首先创建一个符合命名要求的 .md 文件, 在文件最开头写好 Front Matter, 然后就可以写正文了. 写好后保存到 _posts 文件夹, 最后使用以下命令生成静态网页就行了:

# build 命令要在 myblog 文件夹里面执行
jekyll build

配置 Web Server (以Nginx为例)

以上讲了 Jekyll 在本地的配置和博客发表的步骤, 下面是最主要的, 怎么让你的博客让全世界的人看到 ( lol,一般来说大多数个人博客只有你自己一个人看, 别气馁, 自己至少还有一个观众. 为了自己, 也要在台上好好表演哈).

世面上主流的 Web Server 主要有两个, [Apache] 和 [Nginx], 这里主要介绍一下 Nginx 的配置.

安装 Nginx

yum install nginx

转移生成的 _site 文件夹

# 将 _site 里面的所有文件复制到 nginx 目录下 
cp _site/* /var/share/nginx/html

Jekyll 本身自带 build 到其他文件夹的功能, 所有不用每次都手动复制.

jekyll build --destination /usr/share/nginx/html

如果不想每次写完新的文章都要执行一下 build 命令, 可以使用 auto-regeneration 功能, Jekyll 会监视 _post 文件夹, 当有新的文件加入或者更改时, 它会全部重新生成静态文件. 但这个功能对内存有一点要求, 我的小 VPS 使用这个功能时, 内存是跑满的. 这里有个曲线救国的办法, 可以使用 Crontab 定时功能来设置每隔一段时间 build 一次, 虽然没有实时 build 那么高端, 但对个人博客还是足够的. 之前设置的是半小时跑一次 build 命令, 却一次都没成功过, 这里还要研究一下, 成功之后再来更新.

jekyll build --destination /usr/share/nginx/html --watch

上面的命令是重新生成全部文件, 当发布新的博客时, 一般情况下只会加入某一个新的文件, 之前的文件是不动的, build 之前的文件是无用功, 虽然 build 的速度还是蛮快的, 一般只要 2 - 3 秒, 这个是在文件不多的情况下, 如果有几百, 几千个文件, 每次 build 必然会很痛苦. Jekyll 3 引入了 incremental-build 功能, 只 build 发生变化的文件, 所以效率很高:

jekyll build --destination /usr/share/nginx/html --incremental

配置 SSL

随着 Let's Encrypt 推出免费证书以来, 越来越多的证书机构加入了这一潮流. 给自己的网站加上一把小锁, 又不用花钱, 何乐而不为呢, 虽说个人博客没什么东西值得加密传输的, 但是加了绿色小锁的网站给人感觉更加专业.

之前试着配置一下 Let's Encrypt 的免费证书, 它的 Cerbot 竟然在我的小 VPS 跑不动, 然后放弃了. 后来在 V2EX 上面看到有人做了一个免费从StartSSL获取证书的工具, 按照他的教程跑了一下, 顺畅多了. 不过不是完全明白 Install issued cert to apache/nginx etc 这一个部分, google 了一下, 找到一个官方安装教程.

以下是自己 Server Block 的配置, 这里参考了DigitalOcean的两篇文章, How To Set Up Nginx Server Blocks (Virtual Hosts) on Ubuntu 14.04 LTS 和 How To Create an SSL Certificate on Nginx for Ubuntu 14.04:

server {
    listen       80;
    listen 443 ssl;
    
    server_name  luohuan.me www.luohuan.me; 
    ssl_certificate /etc/nginx/ssl/luohuan.me/luohuan.me.crt;
    ssl_certificate_key /etc/nginx/ssl/luohuan.me/luohuan.me.key;
    ssl_protocols       TLSv1 TLSv1.1 TLSv1.2;
    ssl_ciphers  ALL:!DH:!EXPORT:!RC4:+HIGH:+MEDIUM:!LOW:!aNULL:!eNULL;
   
    if ($scheme = http) {
        return 301 https://$server_name$request_uri;
    }
}

重启 Web Server 之后, 就能看到 domain 前面的绿色小锁了.

service nginx restart

配置 Domain

luohuan.me 这个域名是 namecheap 免费赠送的, 如果你也有 .edu 邮箱的话, 不一定是美国的教育邮箱, 赶快去领取吧, 一年有效期, 赠送一年隐私保护.

在 Advanced DNS 下, 把 A Reocrd 的 Value 改成你自己 VPS 的 IP 地址, 然后添加一个 CNAME Record, 把二级域名 www 指向自己的 一级域名, 这样你就能通过域名来访问自己的博客了.

总结

一个属于自己的博客终于搭好了, 下面该干嘛呢? 很多人都能走出这一步, 搭建博客, 这一步既是开始也是结束,而写博客却是很少人能够坚持的. 希望自己能够有信念写下去, 谨以这一篇简单教程献给在折腾路上的你我们.