30Jan2015

Application Development: Backbone framework: modern professional front-end approach

Nowadays, web is not just loading pages and displaying them correctly. Modern browsers allow web application developers to create complicated one-page rich solutions on the client side: rich text processors, graphics editors, spreadsheets, etc. Backbone [http://backbonejs.org] is one of the best straight forward solution to organize even very complicated project in robust professional way. Practically, it’s very small set of JavaScript classes, that you can review in an hour.

The main idea is to split the code into 2 sets of classes: Models and Views. A Model is responsible to handle all data of specified component. It loads, saves and represents it for a View. A View is rather a controller to handle UI, render widgets and specify actions for a Model to provide any changes. You can use any front-end HTML templates system within Backbone Views.

Marionette.js

As I said above, Backbone is just a set of approaches to organize complicated project in robust way and a bunch of source code to help with it. On the other hand, it doesn’t cover all Application Development aspects on the client side. A lot of standard things should be implement by hand. Wait, it doesn’t look like good idea. There is Marionette [http://marionettejs.com] framework available as solution. So, you can stay away of reinventing the wheel and spend time on business logic and cool visual features. Marionette simplifies your Backbone application code with robust views and architecture solutions, provides lists, layouts, subviews and communication between components.

HTML5 mobile applications

Backbone is widely used to implement HTML5 mobile application for all kind of mobile platforms. Phonegap and Titanium solutions provide native wrapper for HTML5/JavaScript application to treat one-page client as mobile application. The idea here is to reduce Application Development time/costs because in majority of cases JavaScript coding is faster and cheaper that native programming.

Alternatives, pros and cons

Backbone and friends set is not a single solution available today. There are several alternatives in application development. It would be incorrect to say they are better or worse than Backbone. They use a bit different approaches. For example, Angular and Ember are very popular frameworks as well. These methodologies provide even more cool features out of the box to speed up development process and reduce kilobytes of source code. On the other hand, developer should follow their much more strict rulers. It would be impossible to do anything as it is in case of Backbone. As software architecture, you better think twice when you are choosing front-end framework for your next project. If it is a set of some legacy JavaScript code with bunches of custom tricks, you have to use Backbone both for integration and code refactoring and for further development. Besides, Backbone is more friendly at line of integration non-standard components and libraries.

Read also

Comments are closed.