Why I chose Jekyll to develop my website

Today I’ll be sharing why I chose Jekyll to develop my website and why it wasn’t trivial for me.

I had problems, the biggest one was I want to write more in English so I had the idea to start a development blog, where people could find me, read about my projects and my blog on frontend.

First I thougt to start blogging in WordPress, but after using it for some projects I felt like my idea of frontend and web development is to make things from scratch when possible.

I like making things, not using Boostrap or other frameworks which are good tools for some people or to solve some problems but not for this one. I made a list of things I would like to have after dismissing few ideas:

1 Blog 2 Projects 3 Interviews with web developers 4 About 5 Twitter 6 GitHub 7 RSS Feed 8 Email 9 FAQ

1. Search
2. Resources
3. Styleguide (pending)

I realized that having this sections would easy be managed via static files so I started looking for a tool and found one, Jekyll a Static Site Generator, which isn’t officially supported on Windows but it is still possible to run it as I did because I use Windows 10 for now.

Having only static files on the server means its fast and secure and with no needs of data bases to serve assets dynamically.

Advantages of static site generators over dynamic sites

While Jekyll manages your content, it is not a CMS in the way Wordpress is. Since there is no back-end GUI, Jekyll relies on hand coding which I love. This has its pros and cons depending on the site you want to build.

• Speed – your website will perform much faster, as the server does not need to parse any content.
• Security – your website will be much secure, since there is nothing that can be exploited server side.
• Simplicity – there are no databases or programming languages to deal with. HTML and CSS is enough.
• Flexibility – you know exactly how your site works, as you made it from scratch.

How Jekyll works

Jekyll then works its magic by combining YAML front matter with the Liquid Tempting System. Jekyll will search for files with YAML front matter, any file that has it will be able to use variables from Liquid. That, in combination with your HTML, CSS, and JS files will tell the site how to look and behave.

Finally the importance of its modularity helping you follow the DRY principle of programming from a folder that begins with an underscore like so:

// Markdown
_includes
    layout-header.html
    layout-footer.html
    section-head.html
    component-reading.html

Furthermore, any time I want to make a change to either, I only have to update it in one place and it’s pushed out to the entire site.

Of course, dynamic sites have their advantages as well, with no back-end GUI tu manage updates, plugins and for no tech-savvy people would be more difficult to admin the website, write content and push changes to the server.

GitHub Pages to the rescue

GitHub Pages accepts static HTML but can’t execute languages like PHP, or use a database in the way you’re probably used to, so you’ll need to output static HTML files. You can host your static website for free directly from your GitHub Repo.

Iterating is the key

I then spent the following 7 months iterating and iterating. During this period, other projects fell by the wayside as I got distracted by yet another feature addition, performance improvement or design detail.

I have lot of things to do:

• Refactor lot of CSS classes which aren’t ok. Classes aren’t well suited defining the HTML structure.
• Want to help people with disabilities to navigate my site in a better way, making it accesible which is not.
• Optimize my website assets and code to get

100/100 on Google Pagespeed which I have not.

What now?

Well, you can grab the RSS feed, follow me on Twitter and keep an eye on the project on GitHub.

Thanks, Ignacio.