How to perform View Rendering in Backbone.js

Backbone.js helps give structure to web apps by:

• providing key-value bindings and custom events
• providing collections with an API of enumerable functions
• providing views with declarative event handling
• providing compatibility with existing API over a RESTful JSON interface

Backbone.js helps keep business logic separate from UI to simplify working with the Interface – it is separated into Model and View:

View Rendering

A View is a chunk of the user interface that often renders data from a specific model or models. However, views can also be data-less chunks of UI that stand alone.

Models are unaware of views. Views listen to the model change event and react or re-render themselves appropriately.

Each View manages the rendering and user interaction within its own DOM element.

Strictly not allowing views to interact with others can allow them to render in isolation.

Backbone.js allows all processes used to render View objects and their subviews into UI. The user defines how the models are translated. Some basic approaches to rendering views can be found in the Backbone primer.

View.Render()

You can override the Backbone.js render method by adding your own code to render the view template from model data and update HTML. This method will contain logic on how to render the template that renders the view.