Resources For, And How I Learned Backbone.js

13 September, 2011. It was a Tuesday.

I received an email from Mark Muskardin, today, asking me some questions centered around how I ramped up and learned backbone, and looking for some good resources, too. I’ve had similar questions a number of times in recent weeks, so with Mark’s permission, I’m posting his questions and my answers here.

Update: I’ve put together a more complete list of resources on my BackboneTraining.net site, and will keep that page up to date. Be sure to check that list for more links and additional resources.

1) How did you ramp up on Backbone?

Mostly trial and error, honestly. I would try something to see if it worked or not and dig into the Backbone source code to find out why it didn’t in most cases. I also spent a lot of time looking at the example backbone code I could find in blog posts, in the documentation, etc.

In the end, though, it was really the throw-away applications I built that had the most impact for me. I would spend a few hours a night thinking about another way to approach a specific scenario in backbone, and try it out. In the process of doing this and exploring the different aspects of backbone, I learned a lot about how it works and how i like to work with it. (FWIW: I think this pretty well describe my learning style)

I also have a strong background in building windows applications with a model-view-presenter structure, in a composite application style. Backbone fits easily into my prior experience in this realm, so a lot of what i have been trying out and learning is stuff that i knew how to do previously, just putting it in to play in a different language and runtime. I think this gave me a pretty good advantage in terms of “things to try” in my throw-away apps.

Lastly – I started spending time keeping up with the Backbone mailing list, and the Backbone questions on StackOverflow. Try to answer questions, and seeing the answers that others provide has helped me a lot. Not knowing an answer often leads me to dig deeper into something in order to learn, so that I can answer, too.

2) Are they are any tutorials you’d recommend?

I tend to prefer tutorials that not only tell you what and how, but also why. So it shouldn’t be a surprise that I’m listing a handful of screencasts that I thought were tremendously informative. Every one of them has taught me a number of little details and/or given me a few ideas to try out.

(in no particular order)

(Note: i’m also working on a very extensive screencast, but it won’t be available until probably late this year or early next year…)

There’s also the thoughtbook book: http://workshops.thoughtbot.com/backbone-js-on-rails. It’s a work in progress, but it’s worth keeping up with the progress. They’re doing a really cool thing with community involvement. I’ve been reviewing the book from time to time and offering suggestions for how to improve the book, now and then – as have a number of other people who have pre-purchased the book. There’s a lot of value in the book already, but it’s still in it’s early stages with much of it not being started yet.

Other than the screencasts and book, there’s a wealth of good backbone knowledge in blog posts, on the mailing list, and in the example apps in the documentation. Search around and keep your eyes open as new information is continuously popping up.

3) How do you test your Backbone apps?

For integration tests with the rest of my system, I use Cucumber. Most of the testing I’ve done with Backbone has been through Cucumber since I already have that in my Rails application. I set the tests to use the Selenium driver and run them as part of my normal Cucumber suite.

For unit testing (which I’ve been doing more of, recently) I use Jasmine and the Jasmine-jQuery plugin. My previous blog post addresses this, specifically to get my views under test with my view templates in place. (I’m considering writing a small series and/or e-book on testing backbone, though this is also covered in my screencast, so i may not be able to write an entire e-book on it any time soon.)

4) I saw that your created a Backbone plugin. Does Backbone have a similar plugin/gem ecosystem that jQuery/Rails has? How can I get started?

While it’s not as extensive as jquery or rails, there is a growing backbone plugin ecosystem. There’s also no automatic installation or package management like gems (or npm for node.js) or anything like that. Mostly, people just list their plugin in the backbone wiki, talk about it on their blog and on the backbone mailing list, too.

Before you start, you’ll need to understand object oriented javascript, if you don’t already. For this, I highly recommend the book “Javascript Patterns” by Stoyan Stefanov. Once you’ve got an understanding of how OOJS works, it becomes pretty easy to see how to extend backbone with your own code.

The real question, then, is not “how” but “what” or “why”… the two plugins i’ve written were built out of my own needs and desires to stop writing the same code over and over again. Backbone.ModelBinding is a collection of the patterns I was using for binding models to view elements, and grew from there. Backbone.Memento started as a quick hack to enable a cancel button on an edit form that I had, turned into a full memento pattern implementation, and started growing from there.

So, to get started… identify the common patterns in your own code, first. Extract those into something that a single project can use immediately. Then build and grow from there, as you see similar needs and variations in more and more projects.

Practice, Practice, Practice

The most important thing to take away from this, is that you won’t improve or really learn anything until you do it yourself. It’s great to talk theory all day long (and I love doing that), but without the experience that comes from practice – the art of doing for the sake of learning – it’s just an unproven theory. Get your hands dirty with some throw-away projects, see what works and what doesn’t, and begin to develop your own subtle and nuanced opinions and patterns based on this experience.
← Test-Driving Backbone Views With JQuery Templates, The Jasmine Gem, and Jasmine-JQuery

Recent Author Posts

    Recent Site Posts

      Authors