Intro to Jekyll

Simple intro to the jekyll static generator.
Talk for the FA7#21
http://flipside.org/notes/jekyll-talk/

Transcript

2. Jekyll is a parsing engine bundled as a ruby gem used to build static websites from dynamic components such as templates, partials, liquid code, markdown, etc. 2
3. A static site generator is a program that takes a series of files (like template and contents) generates your website with them. The “blog aware” part means that is more oriented towards the creation of a blog or a website with post‐like entries. 3
4. Although jekyll is oriented toward the creation of blogs it is not a blogging software. It does not come templates or any content. You have to build everything. 4
5. FAST Everything is static so it’s server fast. There’s no server processing, database queries to worry about. Small learning curve It easy to understand how jekyll works and how to use it. After you know its structure and some liquid templating you’re ready to go. No need to rely on server side technologies You don’t need to worry about updates, you don’t need to worry about one of your fancy server plugin being compatible with the last release of php. And you don’t need to worry about security issues. Scenario: If we have a big blog with lots of monthly traffic, what do we do in the end? We’ll implement some kind of caching mechanism and serve static pages. Jekyll only does that before publishing the website. 5
6. The basic structure of jekyll consists on four directories, one config file and the index. All jekyll directories and config files start with na inderscore and there’s a reason for that. These files will be used by jekyll and will not be copied to the _site directory. 6
7. _layout In the layout we have the templates for our pages and posts. Normally we have two templates, a default one (where you decalre the html, head, body) and a post template with the post structure. _post On the _post directory we have the actual content. The naming of the posts is important. They have to be named YEAR‐MONTH‐DAY‐title.markup. Jekyll needs this naming to be able to order the posts. As for the markup of the post it can be either markdown or textile _includes It’s pretty self explanatory. Any partial file you want for your layouts. _site The _site directory is where jekyll will place the rendered website. In the end you will only need the contents of this folder. Other folders and files that you create will be parsed and copied to the _site directory as long as they don’t start with an underscore. So, for example, you could have a folder for your assets, like css, js, images… 7
8. The config file holds the configuration for the website and all the custom variables added to this file will be available site wide through the site variable 8
9. The front-matter is what makes jekyll, jekyll. Every file that contains the YAML front matter as the first thing will be processes by jekyll as a special file. If you don’t add this, the file will be copied over as is. Between the dashed you can set values for predefined variables, like the layout you want to use, or add new variables that will be accessible when you are printing the post. 9
11. Github actually runs a jekyll server so you only need to push the jekyll files and not the rendered website. Github will render it for you every time there’s a commit 11
12. Since it’s only html you can even host it on dropbox. And of course you can use any existent web server. You can find some interesting deploying scripts to render your website and put it automatically on a web server. 12
13. Here is some extra stuff that can improve jekyll even more. Disqus, will allow you to have comments on your website, which is great for a blog. With this you can still have your fast static website and, at the same time, allow community interaction. The jekyll-ga is a plugin that allows you to sort your posts according to google analytics metric for example the page views. As we saw, jekyll sorts the posts by date but with this plugin we can, for example, sort it be popularity. What must be taken into account is that jekyll will sort the posts when the website is build, so, to keep the sorting up to date you would need to rebuild the website periodically. 13