background preloader

Backbone

Facebook Twitter

Backbone Inheritance - RockyCode. Backbone has a great inheritance mechanism.

Backbone Inheritance - RockyCode

It's as easy as Backbone.Model.extend(). This much is obvious. Let's try a few other things, like: Subclassing our own classes, calling to super classes, adding subclass attributes, and adding various subclasses to a collection based on a super class. Let's just envision a potential application where we are modeling locations of different types. In the general case, we'll refer to these things as Locations.

Backbone.js super() function - Some code from joshontheweb. Backbone patterns. Building apps with Backbone.js Here, I try to document the good practices that our team has learned along the way building Backbone applications.

Backbone patterns

This document assumes that you already have some knowledge of Backbone.js, jQuery, and of course, JavaScript itself. Table of contents Thanks. Efficient model memcaching. Posted by Nick Johnson | Filed under tech, app-engine, cookbook, coding This is the first in a series of 'cookbook' posts describing useful strategies and functionality for writing better App Engine applications.

Efficient model memcaching

One common pattern in App Engine is using memcache to store entities retrieved from the datastore - either individual ones or a list of them - to avoid re-executing common queries. The natural pattern is something like this: Michi Kono » Blog Archive » Adding a Centralized Event Dispatcher on Backbone.js. This article contains my solution to adding a simple global event dispatcher to Backbone.

Michi Kono » Blog Archive » Adding a Centralized Event Dispatcher on Backbone.js

It should also help noobies (myself included) understand how Backbone events work (which has one big gotcha). Sharing Events = Global Dispatcher Today, I came across a fairly mundane – and probably common – problem: I have two views that need to talk to each other. BigBinary Blog. Auto-Save User's Input In Your Forms With HTML5 and Sisyphus.js. Advertisement This article is the third in our new series that introduces new, useful and freely available tools and techniques, developed and released by active members of the Web design community.

Auto-Save User's Input In Your Forms With HTML5 and Sisyphus.js

The first article covered PrefixFree; the second introduced Foundation, a responsive framework that helps you build prototypes and production code. This time, we’re presenting Sisyphus.js, a library developed by Alexander Kaupanin to provide Gmail-like client-side drafts and a bit more. What Problem Needs Solving? Have you ever been filling out a long form online or writing an eloquent and spirited comment when suddenly the browser crashes? (Image: Kristian Bjornard) Imagine the storm of emotions felt by a user who had to add just a bit more information before submitting a form and then loses all data. Existing Solutions One common solution is to write one’s comments in a local document, saving the file periodically, and then copying and pasting the text into the form once it’s complete. (al) Developmentseed/bones. Tbranyen/vertebrae. BackboneFU, Resources for the Backbone.js developerBackboneFU, Resources for the Backbone.js developer.

This article briefly discusses how the Backbone.View class is normally used and then introduces a new class that helps makes it easy to synchronize your models and views.

BackboneFU, Resources for the Backbone.js developerBackboneFU, Resources for the Backbone.js developer

The Backbone.View class helps you do a couple of important things that I’ll discuss in very brief detail: (I assume that you are already familiar with Backbone.Views) Create browser DOM elementsListen to DOM element eventsListen to model events Create browser DOM elements: Tbranyen/backbone.layoutmanager. The Little Book on CoffeeScript - Classes. Classes in JavaScript seem to have the kind of effect that cloves of garlic have to Dracula for some purists; although, let's be honest, if you're that way inclined, you're unlikely to be reading a book on CoffeeScript.

The Little Book on CoffeeScript - Classes

However, it turns out that classes are just as damn useful in JavaScript as they are in other languages and CoffeeScript provides a great abstraction. Behind the scenes, CoffeeScript is using JavaScript's native prototype to create classes; adding a bit of syntactic sugar for static property inheritance and context persistence. As a developer all that's exposed to you is the class keyword. class Animal var Animal; Animal = (function() { function Animal() {} return Animal; })(); In the example above, Animal is the name of the class, and also the name of the resultant variable that you can use to create instances.

Rendering Views in Backbone.js Isn't Always Simple by Ian Storm Taylor - Vimperator - FF13 - Developper. When I first started using Backbone, one of my biggest unsolved problems was finding a good pattern for rendering views.

Rendering Views in Backbone.js Isn't Always Simple by Ian Storm Taylor - Vimperator - FF13 - Developper

It seems like it should be easy, but there are lots of pitfalls that crop up in larger apps, so I’ll show you what we’ve settled on at Segment.io. The first problem with learning how to render views is that Backbone tutorials rarely go deep enough to run into any of the problems that larger apps have. Most projects aren’t as simple as the typical todo-list examples. So before we start evaluating different methods, here are my requirements for rendering a view: Render should be able to be called multiple times without side effects.

With those requirements in mind, here are some ways I’ve seen people rendering their views that don’t fit our needs: Unbinding DOM events by accident. You’ll often see people rendering a template using jQuery’s html() method: render : function () { this. That makes sense, and works perfectly if you never deal with subviews. Not using templates! Backbone.js.