After graduating from DBC, one of the very first tasks I had to complete was building a personal website. Aside from using it to give basic information about myself, I also decided to use it as a blog. The best way for me to keep track of what I’m learning and reinforce new information is to document my learning process of anything I decide to learn. After multiple trial and errors with learning new web softwares such as Wordpress, which seemed simple and easy to use, I decided that Jekyll would be the best option for blogging because of its many benefits. Learning Wordpress and Jekyll had their own learning curves, but learning how to use Jekyll seemed to be the most worth it. Here is what Jekyll is and why it works well.

What is Jekyll

Jekyll is a Ruby gem and a parsing engine that is commonly used for blogging or generating static sites. It contains a template directory that contains raw text files in various forms to run through a converter (such as Markdwown) and its Liquid render and spits out a complete static website.

Benefits of Jekyll

• Easy to use. Rather than installing server-side software built with languages such as PHP, you use the command line and jekyll commands on your local machine to generate static files.
• Jekyll is more secure and faster than any other CMS.
• It’s faster because unlike other services such as Wordpress, Drupal and Tumblr, the HTML is generated before deployment to the server instead of during each web request.
• It is secure because there is no code run on your server.
• No Database.
• Easy integration with Github.
• Jekyll can be hosted on any web hosting service that serves static files such as Heroku, Amazon EC2, Amazon S3, and CloudFront.

As I mentioned earlier, Jekyll had its own learning curve. It expects your website directory to be formatted in a specific way. The jekyll directory is laid out like so:
- _config.yml: File where you can set up basic configuration settings such as name, social media handles, descriptions, collections, build settings, base url, etc.
- _includes: Folder for partial views (footer, header, head, etc).
- _layouts: Folder where the main templates live. You can put different layouts for different pages or sections. - _posts: Folder where your posts live. Posts must be in year-month-date-title.md format.
- _site: Where the generated site will be placed once Jekyll transforms all the files outside of this jekyll generated directory. For example, if you have a /index.md file in the root of your website’s folder, it will be processed and copied into _site/index.html. This is done so that Jekyll can parse through your content and build static pages out of them.
- index.html: Main page.

Jekyll also uses a liquid template system. This is where you might see unusual tags in the HTML files, such as the following example:

The curly braces are called Handbars from Mustache.js The three main global variables that are available for Liquid templates are site, page, and content.

The liquid templating system and its parsing abilities were two of a few components that were new to me. However, once I managed to understand what Jekyll is and how it works, it has became much easier to use.