Question

I’m beginning with backbone.js

Going through some tutorials, like the one shown below. I got the feeling, it is really more about how to organize your objects and how to instruct them to interact. And I can do them without backbone.js
So backbone.js looks more like a set of rules, philosophies to me, then an actual plug-in for the most part.
Is that what it is?

(function($){
  var Item = Backbone.Model.extend({
    defaults: {
  part1: 'hello',
  part2: 'world'
  }
 });      

 var List = Backbone.Collection.extend({
    model: Item
 });

var ListView = Backbone.View.extend({
el: $('body'),
events: {
  'click button#add': 'addItem'
},
   initialize: function(){
  _.bindAll(this, 'render', 'addItem', 'appendItem'); // remember: every function that uses 'this' as the current object should be in here

  this.collection = new List();
  this.collection.bind('add', this.appendItem); // collection event binder

  this.counter = 0;
  this.render();      
},
render: function(){
  $(this.el).append("<button id='add'>Add list item</button>");
  $(this.el).append("<ul></ul>");
  _(this.collection.models).each(function(item){ // in case collection is not empty
    appendItem(item);
  }, this);
},
// `addItem()` now deals solely with models/collections. View updates are delegated to the `add` event listener `appendItem()` below.
addItem: function(){
  this.counter++;
  var item = new Item();
  item.set({
    part2: item.get('part2') + this.counter // modify item defaults
  });
  this.collection.add(item); // add item to collection; view is updated via event 'add'
},
// `appendItem()` is triggered by the collection event `add`, and handles the visual update.
appendItem: function(item){
  $('ul', this.el).append("<li>"+item.get('part1')+" "+item.get('part2')+"</li>");
}
});

var listView = new ListView();
})(jQuery);

Answer 1

Backbone.js, underscore.js and jQuery (they are all interdependent) are an pragmatic abstraction layer and toolset over javascript that allow you to organize your business logic, templates, and models.

The key benefit of this is code readability (for long term projects/projects with multiple members), general good practice around organization of discrete parts (keeping your HTML out of your business logic, for example), time afforded to work on the hard/fun parts of your project as opposed to re-inventing the wheel on different browser compatibility issues, and (in the case of underscore) a great toolset to help you manage javascript objects, arrays, functions etc. for safe and sane programming.

Basically, if you choose not to use these tools, you are either prototyping something or have all the time in the world on your hands. If time and sanity is something you enjoy, don’t be afraid to use them!