I have been developing websites in Jekyll for a while now and really enjoy the simplicity provided by the framework. One thing that has always been a chore was deploying updates to the production server. I typical workflow involved building the site on my local machine then using a FTP software to upload the files to the production server.

I had read about deploying Jekyll sites via Git and githooks, but most of the documentation focused on Github Pages and I host webpages on DigitalOcean VPS Droplets. I finally got around to setting up my Droplets for Git deployment and will walk you through how I did it.

First off, I am going to make some assumptions: 1. You have a working knowledge of web servers 2. You have a VPS running a Debian based OS (I run Ubuntu LTS) 3. You have SSH access to the VPS with sudo privileges. 4. You are familiar with setting up Ruby and Jekyll. 5. You are using git for version management of your Jekyll site. 6. A working webserver and git are installed on the VPS.

Setting up Ruby

We need to make sure your system is updated before we begin.

sudo apt-get update

Next we need to install the dependencies for rvm and Ruby. If you are unfamiliar with rvm, it is a Ruby version management tool.

sudo apt-get install autoconf bison build-essential libssl-dev libyaml-dev libreadline6-dev zlib1g-dev libncurses5-dev libffi-dev libgdbm3 libgdbm-dev

We will install RVM (Ruby Version Manager) using the following code:

gpg --keyserver hkp://keys.gnupg.net --recv-keys 409B6B1796C275462A1703113804BB82D39DC0E3
cd /tmp && \curl -sSL https://get.rvm.io -o rvm.sh
cat /tmp/rvm.sh | bash -s stable

If you get an error regarding curl, install it with:

sudo apt-get install curl

Then re-run the RVM installation code:

You will now need to source the RVM installation with something similar to the command below, the exact command will be listed at the end of the text displayed after the installation finished.

source /usr/local/rvm/scripts/rvm

To list all available ruby versions:

rvm list known

Using the following commands, you will fist install Ruby, then confirm the version being used by the system.

rvm install ruby-2.4.1
ruby -v

Installing Jekyll

First things first, we need to make sure Ruby Gems is ready. Open your bashrc in your favorite text editor. I use vim, but you can certainly use nano if you want.

vim ~/.bashrc

Copy the following lines of code to the bottom of your bashrc file. Save and close.

export GEM_HOME=$HOME/gems
export PATH=$HOME/gems/bin:$PATH

Now install Jekyll and Bundler using Ruby Gems.

echo "gem: --no-document" > ~/.gemrc
gem install bundler jekyll

Congratulations, you now have Jekyll and Ruby installed on your server!

Setting up git

This set of steps should be completed on the remote server. We will be creating a bare repo (to receive the pushed files) and a post-receive git hook (to build the Jekyll site).

Setting up a bare repository, this will be the deployment location that you will push your site to. Make sure you are in your home folder.

cd
mkdir awesome.git && cd awesome.git
git init --bare

Now we need to setup the post-receive hook. This will execute a script, building the Jekyll site after the repository receives files from a git push.

cd hooks
touch post-receive
vim post-reveive

Now copy and paste the following script into this new post-receive file. GIT_REPO is the path to the bare git repository we just created. TMP_GIT_CLONE is a temp folder that is used by the script to build the site before copying it to the deployment folder PUBLIC_WWW. Make sure you modify the script for your particular situation or it will not work.

#!/bin/bash
GIT_REPO=$HOME/awesome.git
TMP_GIT_CLONE=$HOME/tmp/git/awesome
GEMFILE=$TMP_GIT_CLONE/Gemfile
PUBLIC_WWW=/var/www/awesome.com/public_html

git clone $GIT_REPO $TMP_GIT_CLONE
BUNDLE_GEMFILE=$GEMFILE bundle install
BUNDLE_GEMFILE=$GEMFILE jekyll build -s $TMP_GIT_CLONE -d $PUBLIC_WWW
rm -Rf $TMP_GIT_CLONE
exit

Save the file and exit. Then make the file executable:

chmod +x post-receive

This should conclude everything you need to do on your server. Now we will move back to the development machine.

Adding a new Git Remote

On your local development machine we need to setup a git remote to allow you to push the repo to your web server. This remote will be connecting via SSH. Make sure you change your credentials to match your server and adjust the repository name to match the bare repo on your server.

git remote add deploy user@awesome.com:~/awesome.git

You should now have a fast way to deploy your Jekyll website using git and git hooks. All you need to do after making changes to the website is commit the changes to the repository, then push to the deploy remote.

git push deploy master