Getting started with Jekyll

Last week our cohort had the opportunity to attend the UX Strat conference and hear from UX Designers from Google, Amazon and Intel to name a few. Priyanka Kakar and Troy Parke, from Disney, spoke about some of the tools their teams employ including Sketch measure and Jekyll. I wasn’t familiar with Jekyll, so I thought I’d dive in to better understand how this tool can transform plain text into static websites and blogs.

Installation

Jekyll provides a few simple steps to get up and running through the Terminal.

However, if you are running a newer version of macOS, you will likely get an error message after attempting to install the gem.

This is a mac security feature to protect certain folders on the computer. To get Jekyll up and running, it may be necessary to first install Homebrew, “the missing package manager for macOS”. Copy and paste the script below into the terminal prompt:

The message in the terminal should reveal an installation success screen:

Homebrew creates a command called ‘brew’. The next step is to type ‘brew install ruby’ into the command line. Homebrew is built on a programming language called Ruby, so it needs to be installed on the computer. Finally, it is time to install Jekyll! Type ‘gem install jekyll’. If you’re lucky, this should do the trick, however, I received another error message: “While executing gem … (Gem::FilePermissionError) You don’t have write permissions for the /Library/Ruby/Gems/2.0.0 directory.”

I hit several more error messages at this point, but I pushed through and found a couple solutions through stack overflow.

Whew! Jekyll is installed!

Using Jekyll

The standard Jekyll theme can be updated, there are also hundreds of themes available:

Now that Jekyll is installed and I have the basic template, I’ll spend more time learning about the file structure and how to create my own posts.

What did I learn?

It took me WAY longer than I’d anticipated to troubleshoot the Jekyll installation process with my new mac OS system. Technology is constantly changing and it’s not always a simple process to install something new on your computer. However, throughout this process I learned about gems, installing computer languages, verifying the version of a program, how to use Homebrew and, of course, the benefits of stack overflow. My new best friend. I’m also getting more comfortable with the command line interface. I’ve spent enough time with developers to know that a big part of their job is find answers to tough problems. I believe this extends to UX Designers as well and I hope to continue to improve my troubleshooting skills over the course of this year.

Resources

Jekyll Website: https://jekyllrb.com
Getting Started with Jekyll Tutorial: https://youtu.be/iWowJBRMtpc
Jekyll for Web Designers: https://www.lynda.com/Jekyll-tutorials/Jekyll-Web-Designers/383124-2.html