background preloader

Application

Facebook Twitter

Zepto.js: the aerogel-weight jQuery-compatible JavaScript library. Backbone.js. Backbone.js gives structure to web applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing API over a RESTful JSON interface.

The project is hosted on GitHub, and the annotated source code is available, as well as an online test suite, an example application, a list of tutorials and a long list of real-world projects that use Backbone. Backbone is available for use under the MIT software license. You can report bugs and discuss features on the GitHub issues page, on Freenode IRC in the #documentcloud channel, post questions to the Google Group, add pages to the wiki or send tweets to @documentcloud. Backbone is an open-source component of DocumentCloud.

Downloads & Dependencies (Right-click, and use "Save As") Backbone's only hard dependency is Underscore.js ( >= 1.7.0). Getting Started Models and Views Model Orchestrates data and business logic. Amazing HTML5. Crafting Native Looking iOS Apps with HTML, Backbone.js, and PhoneGap. If you just want to try the application in your browser, click here. The data is based on Dwight’s original org chart :) I’ve been blogging a lot about Backbone.js recently. Backbone.js is a lightweight architectural framework that brings structure to your Web applications. Backbone is not, however, a user interface framework that helps you with the way your application looks. So, where do you turn to for help when you need to make your application look good? For traditional web apps (delivered through a browser), Twitter Bootstrap can help (read here).

The alternative to using an existing UI toolkit is to roll your own styles to make your application look and behave like a native app. As I was getting ready to tackle the challenge, and build a new native looking version of my Employee Directory app, I came across this great blog post by Chee Aun where he documents the process he went through to build his own Hacker News mobile app. PhoneGap Source Code. Backbone.js and Twitter Bootstrap Sample App. Try It Enter a few characters in the Search Box in the upper right corner of the screen, and select an employee. In the Employee view, you can navigate up and down the Org Chart by clicking either the Manager link, or one of the Direct Reports in the sidebar on the right of the screen.

Show Me » Get the Code The source code for this application is maintained in this GitHub repository. The repository includes several adapters to use the application with different data persistence solutions: in-memory store, REST API, REST with JSONP, Node.js, MongoDB, etc. Download » Get More The Employee Directory use case is simple enough to be easily understandable.

Visit the Blog. NodeCellar: Sample Application with Backbone.js, Twitter Bootstrap, Node.js, Express, and MongoDB. In my previous post, I shared my recent experience building a RESTful API with Node.js, MongoDB, and Express. In this post, I’m sharing the client application that uses that RESTful API. The Node Cellar application allows you to manage (retrieve, create, update, delete) the wines in a wine cellar database. The client application is built with Backbone.js and Twitter Bootstrap. Run the Application You can run the application here. For obvious reasons, the create, update, delete features have been disabled in this hosted version. NOTE: Node.js is running on port 3000 on my EC2 Instance. Server-Side The details of the Node.js, MongoDB, and Express implementation are documented in my previous post. Client-Side In this application, Node.js is used to provide the RESTful services that the client application needs to manipulate the data.

This is a Node.js and MongoDB powered version of an application I initially posted here with PHP and Java backends. Source Code. Node Cellar. Node.js. Express - node.js web application framework. MongoDB. iOS style notifier/close/delete/new. Progress Bar Button. Delete menu with modal dialog box.