Autodeploy Jekyll

My friend is a dentist. He usually asks me when there is some computer related trouble especially when it is about hardware. I have no clue about hardware and I don’t know why he asks me.

However he missed the chance to ask me about his plans for a website. He hired an agency and paid a lot of money to them. I have something to tell when it comes to web dev and When I reviewed the site a few months later I found out the agency created a horrible mess.

He couldn’t learn the things he needed for using Typo 3 and called me when he wanted to change something. I thought I would give him some help while he would help me with my teeth.

My first idea was to install WordPress. But I was soon pretty sure my friend would be afraid to hit the “update” button. Also the lot of options in WordPress would most likely confuse him even when I would give him less rights. In my experience you’ll need some basic HTML skills from time to time when you work with WordPress to pimp your posts.

I decided that it would be better for him (and for me, finally) if he would learn a bit of Markdown. Actually Markdown is much easier to understand than HTML. With that in mind it was easy to decide on Jekyll and soon reworked the templates provided by the agency.

Now I wanted my friend to be able to update his website alone. I thought quite a while about it and found prose.io. This is a pretty nice editor. Unfortunately I didn’t see how I could install it in a breath and put prose.io on hold until I have more time to check on it.

First: Get locally files synced

I wanted my friend to work on his own PC. No more logins and hopefully no more CMS interfaces to deal with. First I thought DropBox would be a good idea. I could write some code using the DropBox API to get changes and build it automatically.

Luckily I have found SparkleShare.

SparkleShare is some kind of DropBox for non-technical people. With the difference it doesn’t work with a filesystem but with GIT. In other terms: SparkleShare more or less checks out your repository. And whenever you edit a file and save it, SparkleShare creates a commit and pushes it to your remote repository. In my case I am using BitBucket and can confirm it works like a charm so far.

Sure, “commit on save” is not the best option for many projects. But in this case I think it’s the only tool I want. I will also use SparkleShare for my own fiction writing which I consider another great use case.

SparkleShare is open source and also works with your own GIT server.

With this tool my friend can easily change content and push it to my repository.

Second: Get the changes on your build server

This was pretty easy: I am running a cronjob every minute. The trick is to clone your repository to a directory which is not accessible to the outer world.

Then a cronjob would run something like this:

export PATH=$HOME/.gem/ruby/1.9.1/bin:$PATH
export PATH=/package/host/localhost/ruby-1.9.3/bin:$PATH

export DOMAIN=www.example.com
export SITE_FOLDER=/home/user/virtual/example.com
export NOTIFY=me@example.com
export BUILD_OPTIONS="--future --drafts"
cd /home/user/site-building/my-repos.git
git pull

The first two lines are required by my hoster Uberspace. They provide an excellent service and pre-installed a lot of great stuff. To make Ruby work inside a cronjob, I had to apply a few Ruby things to the path.

Then I create a few variables like DOMAIN, SITE_FOLDER, NOTIFY and BUILD_OPTIONS.

• DOMAIN: This is used for the body of an email which I want to send after build
• SITE_FOLDER: This is the folder from which my domain content will be served
• NOTIFY: This is the email address to which I want notifications after a successful build
• BUILD_OPTIONS: You can leave that empty. In this case I wanted to build future posts and drafts as well. You can read about the available options in the Jekyll Docs

Finally I change the working directory to my git repository and pull the changes from my git server.

Please note: There is a parameter to git pull which helps to avoid cd’ing into a directory.

Also note: I created a Bitbucket Deployment Key which lets me process easily suck the changes.

Now my changes arrived on my web-server. Since I am able to install my own Ruby Gems with Uberspace I simply needed to install Jekyll which is a one-liner.

Third: Build and deploy

I could have put all my build code to the cronjob script. But I wanted to avoid the webhost needs to build the website every minute even when there are no changes.

You could check the return value of “git pull” but since git is localized (whoever needs that, it’s horrible!) the return message can vary.

Luckily there is an elegant solution which is called “Git Hooks”.

If you want to execute an action when something was pulled, you need a “post-merge” hook. It will only be executed when new content was merged after pull. Please note this hook will not be executed when there was a merge error. Better leave the site-build directory alone!

My post-merge script looks like:

#!/bin/bash

rm -rf _site
jekyll build $BUILD_OPTIONS
rsync -rtv _site/* $SITE_FOLDER

echo "http://"$DOMAIN | mail -s "Website was updated" $NOTIFY

You see, I have used a lot of the previously defined variables.

First I remove _site. This folder is created by Jekyll and for each build I want a clean state of the site. Otherwise deleted pages might not disappear.

Then I run “jekyll build” and pass along the previously mentioned options.

Afterwards I sync my site building folder with the public html folder. rsync has a lot of options available, make sure you check them.

Finally I want to notify myself that the website was updated.

Conclusion

With the right Webhoster (Uberspace), GIT, Bitbucket and Sparkleshare it is super-easy to set up a GitHub Pages like auto deployment. In fact some kind of this would have a cost of 1€ (minimum for the pay-what-you-want webhosting service).

One last thing: if you plan a lot of modifications it’s always a good idea to quit Sparkleshare and avoid a lot of builds :)