Serving Jekyll the Easy Way

20th February 2021

Coding

Jekyll is a free, open source tool for transforming documents, such as markdown files, into static webpages.

You can read more about Jekyll on their website https://jekyllrb.com/.

Running Jekyll can cause challenges however, you need to have Ruby installed along with all the modules it requires, this could cause conflicts with other Ruby applications you have running.

To over come this issue, let's use our old friend, Docker.

This will allow us to run a containerized version of Jekyll and forget about conflict issues.

Setting up

Let's start by creating a new Jekyll project, this can be stored locally or under source control.

For this example, I am using Ubuntu 20.04 via WSL 2 (Windows Subsystem for Linux).

From the directory where you wish to store your project run the following.

docker run --rm --volume="$PWD:/srv/jekyll" -it jekyll/jekyll jekyll new .

When this command has finished you should see the following files in the directory.

root@smithymx67:/mnt/d/JekyllTest# ll
total 9
drwxrwxrwx 1 sam sam  512 Feb 20 17:54 ./
drwxrwxrwx 1 sam sam  512 Feb 20 16:34 ../
-rwxrwxrwx 1 sam sam   56 Feb 20 17:54 .gitignore*
-rwxrwxrwx 1 sam sam  419 Feb 20 17:54 404.html*
-rwxrwxrwx 1 sam sam 1125 Feb 20 17:54 Gemfile*
-rwxrwxrwx 1 sam sam 2080 Feb 20 17:54 _config.yml*
drwxrwxrwx 1 sam sam  512 Feb 20 17:54 _posts/
-rwxrwxrwx 1 sam sam  539 Feb 20 17:54 about.markdown*
-rwxrwxrwx 1 sam sam  175 Feb 20 17:54 index.markdown*

Building

You can edit and update these files to fit your needs, after that we can build the static site using the following command.

docker run --rm --volume="$PWD:/srv/jekyll" -it jekyll/jekyll jekyll build

After this has finished you can check the directory again to see some new directories, this contains the static site.

root@smithymx67:/mnt/d/JekyllTest# ll
total 13
drwxrwxrwx 1 sam sam  512 Feb 20 17:59 ./
drwxrwxrwx 1 sam sam  512 Feb 20 16:34 ../
-rwxrwxrwx 1 sam sam   56 Feb 20 17:54 .gitignore*
drwxrwxrwx 1 sam sam  512 Feb 20 17:59 .jekyll-cache/
-rwxrwxrwx 1 sam sam  419 Feb 20 17:54 404.html*
-rwxrwxrwx 1 sam sam 1125 Feb 20 17:54 Gemfile*
-rwxrwxrwx 1 sam sam 1870 Feb 20 17:59 Gemfile.lock*
-rwxrwxrwx 1 sam sam 2080 Feb 20 17:54 _config.yml*
drwxrwxrwx 1 sam sam  512 Feb 20 17:54 _posts/
drwxrwxrwx 1 sam sam  512 Feb 20 17:59 _site/
-rwxrwxrwx 1 sam sam  539 Feb 20 17:54 about.markdown*
-rwxrwxrwx 1 sam sam  175 Feb 20 17:54 index.markdown*

Serving

Now it it built, we are ready to serve it, for this we will map port 4000 from the container to the host computer.

docker run --name jekyllTest --volume="$PWD:/srv/jekyll" -p 4000:4000 -it jekyll/jekyll jekyll serve --watch --drafts

Once running, navigate to http://localhost:4000/ to view the site.

You can then use docker stop and docker start to take down and bring up the site as needed.

docker stop jekyllTest
docker start jekyllTest