Yoda On OpenSource

Yoda is wise. And green, as well (ok, maybe not relevant but he is green!)

Now that I’ve finished my Ph.D. at the EBI, it was time to set up a personal page where people could find easily some of my contacts info to have a quick way to contact me. The decision was to use the good old github pages with a cname for hosting, and I’ve written how I’ve done it in this post.

Although a quick html page was a good compromise, I felt It was a bit too short and quick, not giving an enough informative picture. Moreover, I wanted the ability to create several pages to describe projects and other stuff which maybe will come up. Being already on github pages, I’ve decided to use jekyll. Jekyll is a text processor, which converts markup into HTML, having the ability to create a blog if same convention are followed. I love text processors, ’cause it means I can write stuff using an editor and focusing on the content. Then, at later stage, magic happens and the contents looks also good and very well formatted. Same other examples of this process are LaTeX, which is amazing to write scientific publications, and Sphinx, which it’s awesome for documentation (especially Python programs). Easier is the markup language, easier it will conquer the world. for example Markdown is awesome ’cause it feels like writing using decent default (or at least, default that resonate with me.) Ok, stop wandering around and let’s get back on track.

Getting started using Jekyll is quite complicated, because jekyll does not come with any preloaded site or anything, therefore you have to create everything. However, jekyllbootstrap is up to the rescue. Jekyllbootstrap, created by Jade Dominguez, is a series of preloaded template and clever series of addons to jekyll, including themes and external service to handle comments, which it makes possible to decrease the time to start to close to zero!

Jekyllbootstrap gets shipped with the classic (yeah, it’s a classic nowadays) twitter bootstrap, which is a pretty cool frontend helper. Twitter bootstrap version 2.0 has seen a major improvement versus the 1.4 version, where responsive behaviour has been added to the frontend framework. Responsive behaviour is the ability to perform well on any kind of device, using some clever resizing tricks, where the web page changes format and font to adapt to an android or iphone screen, to a tablet, to a laptop screen or to a massive desktop video. All this comes for free, just using bootstrap, therefore it’s very handy to use it. You know, it’s 2012 and mobile should be treated as first web citizen.

I was already thinking to bring the 1.4 theme to 2.0, when I’ve actually found that Geoffrey Dagley had already taken care of it, creating a new repo for it.

So I’ve just installed and I had the theme set up. All was looking good, when I’ve actually find out that there was a problem with the tagline. The tagline was not computed from the metadata, but it was left there as placeholder. Therefore, being a good opensource citizen, I’ve forked the repo,  fixed the problem,  and opened a Pull Request to put it back to the original.

Then, given the fact Thoms Park created bootswatch, I’ve picked cyborg, one of the available theme, which is using the same twitter bootstrap markup, but it has different colors and font, and I’ve created a new theme for jekyll, in its own repo.

So after all this I’ve set up my new website in a bunch of days, corrected and sent a pull request to fix a problem on one of the theme, created a new theme based on bootstrap and bootswatch.

The commodity of jekyll is amazing, ’cause I can create a new file using the nice rake shorthand:

rake post title="a decent title for a new post"

which sets up the file for me and I have only to open it up in gedit and write it!

How does it look like? Check it out!

Michele's web new graphic

P.S.: If Gedit doesn’t recognise Markdown, it’s due to some crazy mime-type problem. Check out this tweet for help: