We plugged in MarionetteJS in Episode 10, and pushed the code as a branch to Github which you can view here
You can watch it up at Vimeo - we remove all the work that we've done to date and plug in MarionetteJS.
This is a different kind of production for us at Tekpub. We're building out an application that we need to use and we're Open Sourcing it as well. We use MongoDB quite often - and many times have wanted to work with a MongoDB explorer much like the RavenDB explorer built using Silverlight.
But who needs Silverlight when you have Backbone and HTML5?
As you can imagine - there are many moving parts to building such an app - but we take our time and start slow. Instead of a linear progression through the intricacies of BackboneJS, we're going to use repetition:
We encourage you to follow along in your favorite IDE/Editor. We've created a starter site that you can use straight away on Windows (with WebMatrix 2) or on a Mac using whatever you like. The entire screencast will be focused on Windows development - but feel free to use a Mac if you like.
In this, the first episode, we take a look at what BackboneJS can do and talk about why you might want to use it. We explore the difference between Backbone and other frameworks like Ember, Angular and Knockout, and finally we get the starter site off the ground.
In this episode we get to the code: creating a simple view for our breadcrumb navigation, and wiring up a simple event. Once again, we do some very, very basic tasks in this episode as we're starting out slowly given that Backbone can become quite complex rather quickly.
In this episode we start to move things along a bit faster as we tackle one of the basic patterns in Backbone: creating a list view. We need to list out our Mongo databases, but before we do that we need to understand how lists work.
Every view needs some data - but how do you hook it all up? In this episode Rob works with collections and their models and wires them up to the views, focusing on doing it "the Backbone way". We also take some time to do some light refactoring.
In this episode things start to get a bit more complex. There are a few moving parts we have to deal with as we shift to dealing with data - and pretty quickly I fail completely as I start to plugin the add and delete events. Once that's sorted, I fail again when it comes to validations. Learning through failure - that's what this episode is all about.
In this episode Rob stops and looks at the code so far in an effort to abstract away repeated patterns. We take a look at other frameworks and how they do things, and see what we can do to streamline our codebase and also make it more flexible.
In this episode we kick up the complexity and venture into the realm of Software Architects. Up to this point, we were laying out a simple Master/Detail page - now we need to add Navigation, Orchestration, and State - and it would be nice if we didn't shoot ourselves in the foot in the process!
Every abstraction has its limits - Backbone is no exception. In this episode we plugin the Ace Editor, an open source code editor that powers Cloud9 IDE. The editor is rather overbearing, and (as far as Rob can tell) it doesn't want to be contained in another framework so we'll need a work around. In addition, we need the concept of MongoDocuments to our project - and we take care of that at high speed.
In this episode Rob finishes things up by bending the Ace Editor into the Backbone structure. Initially it looked like we wouldn't be able to pub the editor into a View, but in this episode we figure out a way! Along the way we clean up the navigation code and wrap things up a pretty bow. This is the final development episode - the next episode we'll migrate over the MarionetteJS with Derick Bailey.
In this free episode here on Tekpub, Derick Bailey joins us and helps Rob remove his homespun abstraction in favor of using MarionetteJS. Marionette is Derick's Open Source project that is, basically, the last 3 years of Derick's experience working with Backbone (daily), wrapped up in a thin layer of abstraction!
The code for this project is up at our Github repo