Employee Contacts Directory

Built with HTML5, CSS3 and JavaScript (Handlebars) - February 2013

This is a quick example I put together to demonstrate the greatness of Handlebars simple templating, versatile helpers, partials and blocks features.

Employees are colour-coded based on salaries. A Handlebars helper function was written which compares the JSON data's {{salary}} key to predefined ranges and returns the necessary class. I also started to extend this to include salary category.

With a little more effort the embedded templates could be precompiled with a shell script and the full Handlebars compilation library replaced with the lightweight runtime version, helping to increase performance and reduce bandwidth.

Go to demo