How I made this blog

This site uses Jekyll as its main engine. Jekyll is a static site generator (used by GitHub) that can take a pile of markdown files, run them through some ERB templates, and give you a nice looking site. It's very flexible, and a coder's dream. No database! Write in markdown! Free hosting on github!

I also got a chance to play around with Compass, a framework built on top of Sass. This allows me to to write high-level DRY CSS, with a lot of helpers for all the newer CSS stuff. (For example, I only have to define a box-shadow once, Compass handles all the -moz-box-shadow and -webkit-box-shadow stuff for me.) I can change the entire color scheme by altering a single variable. Very powerful. I also want to tie in some @media queries so I can have different layouts based on screen dimensions. Kind of overkill for a blog, but I just want to create a RWD proof-of-concept.

I am using a bit of Backbone to render the menu on the side. Backbone is a very powerful and simple MVC library. Notice that i say library and not framework. Backbone gives you a very good set of base classes to work with, but it's really up to you to set up the structure of your app, for better or for worse. You need to know what you're doing, lest you get a ball of mud. It gives you a nice javascript inheritace model, a nice event system, and dead simple encapsulation of AJAX requests. It also introduced me to Underscore, and later its faster cousin Lodash, probably my favorite Javascript library. Underscore/Lodash gives you an awesome set of high-level language and utility functions to use in Javascript. I haven't written a for loop since. My use of Backbone is very basic right now, but I plan to do more with it later.

I am using Grunt to glue all this stuff together into a cohesive build system that auto-generates everything whenever I modify a source file. I'm also using Browserify to stitch together all my javascript code. If you're building into a single file, CommonJS FTW!

I'll probably throw this up on GitHub at some point as example code, also so I can play around with the free hosting there. (GitHub supports Jekyll natively, you just have to define a special project for it.) I'll have to check in the compliled CSS and JS though… (ew…) I also want aeflash.com to be the single source of truth for this blog. I still need to figure out how I want to manage it all.

aeflash code jekyll compass backbone meta