Book Image

Backbone.js Patterns and Best Practices

By : Swarnendu De
Book Image

Backbone.js Patterns and Best Practices

By: Swarnendu De

Overview of this book

Table of Contents (19 chapters)
Backbone.js Patterns and Best Practices
Credits
About the Author
Acknowledgments
About the Reviewers
www.PacktPub.com
Preface
Precompiling Templates on the Server Side
Index

Basic usage of views


Backbone views are the tools that provide a logical structure to the HTML markup of your application. Views represent the data of Backbone models or collections via JavaScript templates. For any change in the associated model or collection, you do not need to redraw the complete page, only update the relevant view—that's it. A basic view can be defined this way:

var UserView = Backbone.View.extend({
  render: function () {
    var html = "Backbone.js rocks!";
    this.$el.html(html);
    return this;
  }
});

// create an instance
var userView = new UserView();
$('#container').append(userView.render().el);

Here we created a simple HTML markup, placed it inside this view's element, and showed the view in the DOM. Let's understand the concept further by looking at all the steps.

Understanding the el property

What is the this.$el property? It is the property that points to the jQuery-wrapped version of el. Every view possesses an el property that either holds a DOM reference...