Introduction to Backbone.js Part 3: Routers – Video Tutorial

We’re on to part 3 in the Backbone.js video tutorials series. This week we feature another important piece of the Backbone puzzle: Routers. You could conceivably create your JavaScript apps without Routers, but the ingenious technique behind routers allows your users to bookmark the app at a particular state or even use the back and forward buttons to traverse through the history of your applications state. Watch the video to learn more!

Backbone.js Video Tutorial Series

Final JavaScript Code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
var Router = Backbone.Router.extend({
routes: {
"foo/:bar" : "paramtest",
"*action" : "func"
},
func: function (action) {
console.log(action);
},
paramtest:function (p) {
console.log(p);
}
});

new Router();

Backbone.history.start();

Conclusion

As stated in the video, I’m sorry for the delay. At least you’ll be seeing two videos this week, though! On Thursday (at least I hope it’s on Thursday) Part 4: Collections should be released. Also, contrary to the itinerary I gave in part 2, I’ve decided to do one more tutorial before taking a break and then starting up the app. Part 5 will contain a tutorial on using AJAX to populate your models. I won’t say whether this comes out next Monday or Thursday, so you’ll just have to wait and find out. In the meantime, keep studying up on the parts 1 through 3 until you feel confident (which shouldn’t take too long).

Backbone.js Video Tutorial Series

Author: Joe Zimmerman

Author: Joe Zimmerman Joe Zimmerman has been doing web development ever since he found an HTML book on his dad's shelf when he was 12. Since then, JavaScript has grown in popularity and he has become passionate about it. He also loves to teach others though his blog and other popular blogs. When he's not writing code, he's spending time with his wife and children and leading them in God's Word.