Sp4ce.net rss

Jekyll Migration

This website is approximately 3 years old. It was first created to show some of my project and to play with some CSS/HTML. I first used WML (Website Meta Language) to generate it and because WML is no more in development, I decided to use Jekyll instead.

Static HTML

My website is entirely done in static HTML. There is no dynamic rendering on the server side and every page is shown as it is. I think dynamic pages are cool but not really a requirement in most of case. The site is a blog and you don’t need a database behind it to store each article and a web engine that displays them.

A blog post is only content that is decorated with some HTML/CSS to make it nice. However this HTML won’t change (except if I decide it), so once you generate your blog post, you don’t have to do it again. That is how static web generator works, they create every page that exists on the site using specific layouts. If you compare it to a dynamic blog, you realize that the blog generates a page every time you visit it !

Jekyll

Jekyll is a blog aware static web generator. It is done in Ruby so you can easily (cf. monkey patching for example) extend the behavior or add a new feature. It uses Markdown or Textile format for blog posts and Liquid converters. This is also the engine behind GitHub Pages, which you can use to host your project’s page or blog.

When you run jekyll command, it goes thought your template directory and generate the html of the site.

Template directory

|-- _config.yml
|-- _includes
    |-- category.html
    `-- post_link.html
|-- _layouts
    |-- default.html
    |-- index.html
    |-- post.html
    `-- under_construction.html
|-- _plugins
    |-- get_language.rb
    |-- page.rb
    `-- post.rb
|-- _site
|-- computer
    |-- _drafts
    `-- _posts
|-- miscellaneous 
    |-- _drafts
    `-- _posts
|-- site 
    |-- _drafts
    `-- _posts
|-- css
|-- data
|-- images
|-- index.en.html
|-- index.fr.html
`-- index.html

The website is generated in the _site folder. I use three categories of posts: computer, site and miscellaneous. In the index page I display the lastest posts of each category in 3 panels. index.html redirects the request to index.en.html which is the English version of the index.

Comming soon

I will post another article on how language is handled on the site. Also I will add the possibility to use twitter to leave reaction on each article.