by Cameron Daigle on August 15, 2012

Here in Hashrocket Front-End Coding Land, we like our plugins lightweight, manageable and practical. Inevitably, this has resulted in some custom plugins that tend to find their way onto pretty much every project in one form or another. Here are four of those plugins, in no particular order. Hopefully one or more of these will help make your life easier as well.

This is Shane's newest creation – a lightweight solution to an issue that's been plaguing us for a while. We tried dummyimage.com, but it would occasionally bog down. In a moment of desperation, I even switched over to placekitten.com for a while, and that - while undeniably adorable - also had performance issues.

One of our guys wrote a Ruby gem to generate placeholder images, but one day Shane realized that this problem could be solved in a platform-independent manner using Canvas, and dummy_image.js was born.

Check out the Dummy Image site here and throw it into your next project. It's a piece of cake to use and has become a standard part of every new project here.

We work on a lot of management UI, and inevitably it'll make sense to show something in a modal (lightbox, popup, whatever you want to call it). After messing with an assortment of prebuilt plugins, Shane rolled our own a while back, and it's been evolving from project to project.

The latest version has been ported to CoffeeScript and weighs in at a trim 3kb when minified. Check it out on Github – while other plugins may have more options & features, we love this one because it generates minimal markup, is easily customizable, and does exactly what we need it to do.

Chosen is a select-box enhancer written & maintained by the good people at Harvest. It takes a standard dropdown and replaces it with a prettier one, complete with a search field and very nice multiple-select capability.

We run across scaling issues with dropdowns fairly often in our projects, and Chosen's autofill UI has become our standard fallback with any situation where a select box has to handle more than a handful of options. Although it's not particularly easily restylable, the design is tasteful enough that a restyle isn't really needed; it fits in nicely with standard browser controls.

Here's the homepage for Chosen – check it out, you'll undoubtedly have a use for it.

Ah, the infamous date picker. Every once in a while, a bit of UI will require the user to choose a date, and that's where the fun begins. Back before Minical, we'd wrangle together some jQuery UI codeball, plop in the jQuery UI Datepicker, and hope for the best.

I finally couldn't take it anymore, realized that a good datepicker plugin was well within my capabilities as a designer-who-also-does-frontend-coding, and Minical was born.

I have a little site for it here with more info and examples. I recently rewrote it from the ground up in CoffeeScript, which resulted in a good learning experience and a vastly improved codebase. It's easy to customize and super-lightweight; I've been adding features as we've needed them. If you just need a calendar and don't need all of the extra features that jQuery UI provides, Minical just might be for you.