Whenever an attribute of the attached model changes, we refresh the view to display the updated data. A change event listener is attached to the model inside the initialize() method of the view as follows:

this.listenTo(this.model, 'change', this.render);

However, there are options that can handle this data binding automatically and you do not need to take care of it for every model-view relationship. This principle is more aligned towards the MVVM design pattern than the Backbone's MV* pattern, and you will find it in frameworks such as Knockout.js and Meteor.js.

For Backbone, there are multiple plugins such as Backbone.Stickit (http://nytimes.github.io/backbone.stickit/), Backbone.ModelBinder (https://github.com/theironcook/Backbone.ModelBinder), and Rivets.js (http://www.rivetsjs.com/). These plugins provide a similar data binding feature. We are not going to discuss each plugin here; however, the implementation process is simple and similar...