Some basic idea about Backbone.js

What is Backbone.js?

            Backbone.js gives structure to web applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions,views with declarative event handling, and connects it all to your existing API over a RESTful JSON interface.

What is a view?

              Backbone views are used to reflect what our applications’ data models look like. They are also used to listen to events and react accordingly.

SearchView = Backbone.View.extend({

initialize: function(){

alert("Alerts hi");

}

});

var search_view = new SearchView;

The “el” property

              The “el” property references the DOM object created in the browser. Every Backbone.js view has an “el” property, and if it not defined, Backbone.js will construct its own, which is an empty div element.Let us set our view’s “el” property to div#search_container, effectively making Backbone.View the owner of the DOM element.

<div id="search_container"></div>

<script type="text/javascript">

SearchView = Backbone.View.extend({

initialize: function(){

alert("Alerts hi");

}

});

var search_view = new SearchView({ el: $("#search_container") });

</script>

What is a model?

              Models are the heart of any JavaScript application, containing the interactive data as well as

a large part of the logic surrounding it: conversions, validations, computed properties, and

access control.

Person = Backbone.Model.extend({

initialize: function(){

alert("Welcome to this world");

}

});

var person = new Person({ name: "Thomas", age: 67, children: ['Ryan']});

What is a collection?

             Backbone collections are simply an ordered set of models. 

var Song = Backbone.Model.extend({

initialize: function(){

console.log("Music is the answer");

}

});

var Album = Backbone.Collection.extend({

model: Song

});

What is a router?

       Backbone routers are used for routing our applications URL’s when using hash tags(#).Defined routers should always contain at least one route and a function to map the particular route to.Also note that routes intepret anything after “#” tag in the url.