Backbone.js by example
javageneration.com
javageneration.com
I started with reading the documentation[1]. It is very well documented and contains a wealth of information.
Then I took a look at the Todo example[2] referenced in the documentation. It is also very well documented and puts together all the basics of the documentation into one clean example.
At this point, I started branching out into other tutorials. Everything I read basically reiterated the documentation and example above. This was good in terms of drilling the ideas into my head more solidly, but I could have stopped after the Todo example.
There was one notable tutorial though that was very different. Backbone provides a framework, but does not specify a structured way to store or load files. I believe this is on purpose. Backbone concentrates on the framework and gets out of your way. This leaves some head scratching though. This tutorial[3] combines Backbone.js with Require.js and provides an intriguing solution.
[1] http://documentcloud.github.com/backbone/ [2] http://documentcloud.github.com/backbone/docs/todos.html [3] http://backbonetutorials.com/organizing-backbone-using-modul...
As a backend developer trying to embrace Backbone, I'm finding that there isn't a wealth of consistently good material to learn from. One tutorial will push everything to the view, and the next pushes everything to the router.
It's hard to determine exactly what the best practices are, and making up my own mind isn't necessarily that informed, as I'm just learning the framework.
I'm hoping for more and more documentation to appear as there are things that I simply can't figure out how to do and can't find a reference for anywhere. Every resource helps.
That said, most of the questions that we field that take the form: "Should I be doing X like Y in Backbone?" ... the answer is usually: Sure, that will work fine. In fact, there's a whole section in the FAQ about it:
http://backbonejs.org/#FAQ-tim-toady
Is there something in particular you're trying to figure out how to do?
Not sure how to accomplish it, as I can't just iterate through the results as I need to put the right sized image into the right-sized grid (or scale it, which might be easier), but either way, I have four columns, some of which have either 1 or 2 rows, and each of the rows may be of different heights.
I know that there will always be seven elements in the template, and there are fixed heights that I can cheat with, but beyond that, I'm stumped.
But it sounds like what you want to do is precompute all of the correct widths and heights for your elements, based on the image sizes. Then, when you go to render, you can simply look up the appropriate width, height, margin, padding for each cell.