Introduction to backbone.js

It is difficult to build single-page web applications or complicated user interfaces by simply using frontend libraries like jQuery. Backbone.js is a lightweight JavaScript library that adds structure to your client-side code. It is based on the Model-View-Controller pattern. It is best suited for creating single page applications using a RESTful service for persisting data.

Backbone.js has only one hard dependency – Underscore.js. It’s also recommended to use jQuery with Backbone.js for DOM manipulation. So you can get started with building your Backbone.js app, using these 3 libraries.

There are various modules provided by Backbone.js.

Model/Collections: Models in Backbone represent data. Model can be created, validated, destroyed, and saved to the server. And Collections are simply a group of models together. For example if i have blog, which contains categories , posts, tags comments, etc. In this case blog post and comments are models, category is collection.

Views: It is very difficult to handle UI component of java script application. Backbone provides an abstraction over the HTML elements i.e. views. Backbone views are used to render models or collections, once we receive some data from the server.

Routers: Routers has a key role to build a single page application. Routes are responsible for navigation, if we want the URL to determine the a single view or multiple views to be rendered, routers are very helpful. routers will look at the requested URL and then execute code based on the requested URL and then render the view to the user.

Events: Events is a module that can be used with any object,. It gives the ability to bind and trigger custom named events with object. Events do not have to be declared before they are bound, and may take passed arguments.

So this blog explain basic features of Backbone.js. In my next blog, we will start looking at the backbone framework in detail with some real life examples.