Backbone: Models, Views, Collections & How They Interact


Backbone.js is a well-known Javascript framework with a restful JSON. Jeremy Ashkenas created backbone, as well as coffeescript and underscore.js. It is based on the model view presenter paradigm. Its only hard dependency is underscore.js. Jquery is an option

to use the library’s maximum potential. Backbone is categorized as an MV framework, while Angular and React are in the MVC category. Backbone is purposely geared towards minimalist data structuring. Through its task delegations normally left up to a controller to its views. It keeps back end logic separated from the user interface by design. In this article I will discuss the three parts of backbone: Models, Views, and Collections and the ways in which they interact.

Models are the heart of any JavaScript application. They contain interactive data as well as a large part of the logic surrounding it: conversions, validations, computed properties, and access control. Backbone.Model can be extended through domain-specific methods. Models provide a basic set of functionality for managing changes.

Views are used to organize interface into logical partitions backed by models. Views can be updated independently in applications without having to refresh the entire page when the model they are associated with is changed. This feature allows programmers to make seamless websites and applications. Instead of looking up an element in the DOM and updating HTML code by hand, a programmer can bind a view’s render function to the model’s change event. This means that wherever that model’s data is used in the UI, it will update automatically.

Finally, collections are organized sets of models. The programmer can bind change events to be fired off when any contained model has been modified. Collections can also listen for, add, and change events. Backbone.js’s three elements: models, views, and collections, work together to say what Backbone.js is used for.