Starting up with Jade

Fri Oct 11 2013

So as mentioned earlier, I have decided to use Harpjs for handling my publishing.

Getting to know Jade

While Harp is pretty flexible at interpreting different file format, I had to choose between ejs and Jade for handling the layout of my site. I decided to go for Jade as its syntax looked nice and clean, and even reminded me Python which I’m in the process of learning. I found it very easy to pick up (specially if you know html well) and its reference page should be enough to get you started. There are some details which are not obvious, and I specially don’t like the fact that tags declared within another tag (say a link within a paragraph) have to be written in raw html (or am I doing it wrong?).

My first task was then to find a template which siuts my needs, and because I’m pretty familiar with Bootstrap, I went ahead and converted the Sticky footer with fixed navbar example they provide which looks like this :

script(src=”https://gist.github.com/kbsali/6936192.js”)

from HTML to Jade :

script(src=”https://gist.github.com/kbsali/6936202.js”)

As you can see the code is nice, clean, readable and we went down from 86 to 46 lines!