There is no one best way to build a Backbone.js app, Backbone.js is so flexible that you can write a good application is many ways.
Backbone.js has a lot of critics. The most obvious of all is the claim that there is no one straight forward way to build a Backbone.js app, more than one recipe exist. Every individual is doing it a little bit different. Not necessarily a bad thing.
What You Already Need To Know
This is a basic tutorial for creating an application architecture but you should already know what is a backbone model, collection, view and how to create them.
Freedom of Coding
You can built an app in any way You want. That can be a bad thing if you are not such a good developer. So I will say to you that if you are planing to be a mediocre developer, don’t develop in Backbone.js, it’s not that it is hard, it’s actually very easy. So easy that it will let you do stupid things, similar to PHP.
Backbone.js is a very versatile tool. You can basically do whatever it is you want. One of these perks is the ability to convert your app gradually to Backbone.js. Yes! it is not a framework, you can play with a little feature and you can migrate your app bit by bit.
Power Of Plugins
In fact it is very easy to use any plugin and embed it in your Backbone.js application. This feature was the most important one for me.
After the ‘why’ let’s move on to the ‘how’, Every Backbone.js app I’m building has the same structure layout. It does not have to be in that structure, I just found out that most of the time that structure is a best practice for me.
I’m using one global variable that holds the entire application. Usually I call it ‘app’.
here is the structure of the app object:
Under the app object there is another object called ‘bb’ that is my short to Backbone, all my Backbone objects will exist under the ‘bb’ object.
Under the ‘bb’ object there are three types of objects that start with an uppercase
All of the models will be under ‘app.bb.Models’, collection under ‘app.bb.Collections’ and views under ‘app.bb.Views’
The actual instances of models will be under ‘app.models’, same for collections and views.
Creating a New Model Object
When creating a new model, just extend the ‘app.bb.Models’ object:
It is best practice that the object name will also start with an uppercase, this way it will be easy to distinguish between objects and object instances.
Creating a New Model Object Instance
Creating an object instance is simple:
The same process apply to collections and views.
Preserving data after manipulation could be easy when you have a dedicated object for it. Want to create data that is not part of your models / collections / views? In those cases I save the data under ‘app.data’ and ‘app.data.rawData’. This is not a good idea if you have a huge amount of data – the browser have a size limit and with a humongous amount of data it could crash.