Helpful Javascript Libraries in my Toolbox

Here are some of the JS libraries that have made my JS development life much easier. I know that libraries change and new ones sprout, but currently here are a few that I have kept in my toolbox. Note: I am not going to mention the obvious DOM traversal languages such as jQuery or elegant frameworks like AngularJS, Backbone, etc. The libraries that I am going to mention are more for utility that specialize in performing a certain task, and does that task very, very well. These libraries can be easily imported into any JS application, have great documentation and demos that should get anyone up to speed very quickly, and lastly, they are free and available (ie. Github).

1. Underscore

This is the Javascript library “that provides a whole mess of useful functional programming helpers without extending any built-in objects”. Oh how functions like _.each, _.map, _.pluck made object and array operations (ie. iterate, query, update, filter, etc.) much simpler. These functions keeps the codebase very concise, clean, and readable. Plus, I love how it handles the “this” context. No more local variable var self = this or var that = this.

2. Parsley

Where “validating forms frontend has never been so powerful and easy”. I think it is great for a library to take advantage of the declarative language of HTML where using data attributes to define a view’s behavior. Parsley allows us to do that with form validation without having to write a single line of javascript.

ie.
<form id="my-form" data-parsley-validate>
<input type="text" name="name"required />
<textarea name="message" data-parsely-trigger="keyup" data-parsley-length="[10, 50]" />
</form>

But if you need to customize, create a more complex validation flow, or add new validation rules, then Parsley does that pretty easily via javascript.

3. Moment.js

“A javascript date library for parsing, validating, manipulating, and formatting dates”. This is a very intuitive library that does take advantage of the usual format tokens (ie. YYYY-MM-DD HH: mm Z) and handles date objects and ISO pattern strings. I love the “Timeago” feature that has become popular with timelines and history. Also, packaged is internationalization and localization where it will prove most useful when supporting time zones and different languages.

4. D3, NVD3

D3 is a very powerful data visualization tool that I have really loved. The demos are eye-candy, and I have built many libraries off of D3. It does require a deeper understanding of HTML5 canvas/graphics features, but the demos were a great way to dive into D3. With D3, a lot of cool visualization libraries came about especially on the charting front. The one I have used for D3 charting is NVD3, which provides beautiful, elegant charts.

I would love to hear what is in your JS toolbox!