Creating An Easy Blogging Website With Jekyll
People kept telling me I should write a blog, in my job I spend a lot of time talking and teaching people about all things related to software engineering so it’s a good idea to have some persistence of facts and opinion. So one Sunday afternoon I did just that.
I had played around with blogs in the past, like most people I tried Wordpress, but as an engineer I just didn’t feel in control, plus it was too heavy weight for what I saw was a simple problem. I also considered a full Content Management System (CMS) that I would just deploy into Amazon Web Services (AWS), something like Hippo. Again, I thought, what am I doing? That is just work for the sake of work. My interest went away until Feburary 2016.
For entirely selfish reasons I wanted to establish a better profile for myself in the world of IT. LinkedIn was useful, but I’m playing by somebody else’s rules. This was my site after all. I am a strong supporter of cloud-based services, one of the most prominent being AWS and the popular version control system (VCS) - GitHub.
I use GitHub for all my software engineering work, so the personal investment was already there. GitHub offer a service called GitHub Pages, which basically give you the ability to host a website from a GitHub repository. You just create your website files (HTML, CSS, etc) and save them to a repository of your choice.
Jekyll was created as a tool which takes plain text files (and website assets) and turns them into rich static website and blogs. It’s a great idea. You just create layouts, template files, etc. Then create simple site pages which reference them. Once your site is ready, you tell Jekyll to generate it for you. So the result looks like a dynamic CMS-backed solution, but really is just a static website.
So let me talk about how I built this website and created this first article. BTW, I assume you are a software engineer familiar with website development in at least some basic capacity, I also assume you use a UNIX-style operating system like Linux or Apple OS X.
Create your GitHub repository
Just create an account / login to GitHub, create yourself a new repository, clone it to your local machine, done. There are some specific steps for GitHub Page so just follow their guide. If you can’t be bothered to read it, then just create a public repository using the following naming convention
<username>.github.io, just replace
<username> with yours or your organisation’s username.
README.md if you want and create a minimal
_site/ .sass-cache/ .jekyll-metadata
Decide on a theme
These days, unless you are a designer, then I would always recommend finding a free or reasonably priced theme. One such source is Themeforest, you can pick up complete Themes here that are all ready setup for Jekyll. I like supporting stuff like this, so for the sake of a round of drinks ($19 in this case) designing up my website is headache free.
I downloaded my purchased theme, extracted it, and copied the theme files into the folder which was my GitHub repository clone. The theme came with easy to understand documentation on how to customise the site. I say easy to understand, I would expect any software engineer with basic website experience to be just fine.
Install and run Jekyll on your local machine
OK, the production website will run on GitHub Pages, but we need to develop locally. I use an Apple Macbook Pro that is a couple of years old. It runs the latest version of OS X which at the time of writing is El Captain 10.11.x.
OS X comes pre-installed with Ruby which is what Jekyll uses. So installation was as simple as running
$ gem install jekyll.
cd into your repository directory and run
$ jekyll serve, that it, just browse to the URL is displays in the terminal window. There is your website, so edit away.
Craft your content
Follow your theme’s documentation and/or Jekyll’s documentation to create/edit pages. Unfortunately, I can’t give you much inspiration for your site’s content.
Deploy your site
Well this is pretty simple, just sync your repository on your local machine with GitHub.
Note, you don’t actually check-in the compiled
_site directory. This is because GitHub Pages natively uses Jekyll to process your website source. This is great because apart from committing your code you don’t need any other dependencies.
Once you check it in, give it a few minutes and your site will be live on the
github.io URL that is your repository’s name.