backbone.js noob confused by conflicting tutorials [closed]

Question

I'm new to backbone.js and am working my way through some tutorials. I've found a couple that seem good, but there are some inconsistencies in how they implement so I'm looking for a little guidance on best practices.

Here are the tutorials I'm learning from:

• http://www.jamesyu.org/2011/01/27/cloudedit-a-backbone-js-tutorial-by-example/
• http://coenraets.org/blog/2011/12/backbone-js-wine-cellar-tutorial-part-1-getting-started

My questions are:

1. The first tut makes use of Backbone.Controller but not Backbone.Collection. The second does the opposite. Which is the best practice for the "C" in backbones spin on MVC?
2. The first tut defines urls in the Model, whereas the second defines it in the Collection. Which is the better practice?
3. The second tut makes use of Backbone.Router, while the first one does not. Which is best practice?

Alternatively if someone can suggest a better intro tutorial that follows best practices I'd be happy to learn from there. Unfortunately because of the inconsistencies between these two, I'm concerned I might be learning some bad habits out of the gate.

Thanks in advance.

Answer 1

Backbone.Controller was renamed to Backbone.Router last year. I guess you were reading an old tutorial.

BackboneTutorials.com is a decent tutorial for getting started.

Build a small app as you learn and you'll know what Backbone does for you.

The best way to learn Backbone is to go through the annotated source code. Each and every line is commented and explained.

Use the dev version instead of the minified version when building your app. This helps in debugging.

If you are into reading books, check out Addy Osmani's Backbone Fundamentals, a free e-book. The book is awesome, but quite verbose. You can use it as a reference.

See this question on Quora for the definitive list of resources;

Don't worry too much about what's 'V' and what's 'C' and backbone's spin on MVC. The framework does an excellent job of separating code that interacts with the server and the code that performs the core client logic. Templating and updation of DOM Elements is left to you. It's pretty minimalistic in that sense. Backbone provides Events that make the different parts interact with each other.

Answer 2

this is a good question. Though, Backbone isn't taking position on how you should organize your code.

So, the real answer is: it depends.

It depends on the need of your application and how you're used to program.

If you want an overview of some best practice, I'd refer you to the Backbone Boilerplate project: https://github.com/tbranyen/backbone-boilerplate

This project is pretty solid, and really helped me out when starting.

Then, to answer your question (this may feel opiniated, and it is indeed):

1: Backbone is mostly an MV* framework (Model-View-Whatever). Controller logic mostly live into Backbone view, and this is OK for front end developpement as logic is often really tied to the UI (as we are mostly coding interfaces). Backbone isn't coming built in with controller, but if you prefer this type of organization, just build your own.

2: Urls depends on your need. If you're fetching a full collection, set it up on the collection, if you're only fetching (or probably saving) one model, set it on the model. These too live well together.

3: About Router, if you're building multiple pages/sections on your app, use them. But beware of not using routes as action as you would do in RESTful APIs, this will most of the time brings problem eventually (user press back button, etc). So, use routes if you want to manage pages.

Hope this help !!