This is a todo app built using BackboneDiorama. This isn't quite a full TodoMVC app as specified by their site (yet!), but it should help you get started with Diorama.
The app is running on github pages:
http://adammulligan.github.io/TodoMVC/
BackboneDiorama is everything you need to build client-side web applications. Optimised for developer happiness, it builds on the components of Backbone.js and aims to be the easiest and the fastest way to build for the browser.
diorama new projectName
builds you a new project with:- Logical project structure for Backbone components
- Coffeescript concatenation and compilation setup
- Backbone.js+deps and Handlebars templating included and ready for use
diorama generate <lots-of-stuff>
- Rails-style code generators which provide convention and structure to your projects, assist you with proven patterns and allow you to rapidly prototype. Rundiorama generate
for the full list.- Additional lightweight libraries to plug the gaps in Backbone.js:
- Backbone.Diorama.ManagedRegion - Memory managed view switching.
- Backbone.Diorama.Controller - Easy switching between states in your application.
- Backbone.Diorama.NestingView - Nest Backbone.Views inside each other.
- New to Backbone.js? The built in conventions and patterns mean there's no easier way to get started.
- Written entirely in and for Coffeescript, for clarity and elegance of code.
Learn more at the project homepage
The entry point to the application is through the TasksController, which is in src/controllers/tasks_controller.coffee.
Every object has been generated using diorama generate
,
then adapted.
This deviates from the TodoMVC spec a fair bit, mostly in the interests of getting a first version up and running. Longer term, we're aiming to get it fully compliant.
You will need backbone-diorama installed on your machine:
npm install -g backbone-diorama
This gives you the diorama
command. Use diorama compile watch
(in the project directory) to auto-compile your coffeescripts to
js/application.js. Then, open index.html to start the app.
Check the project homepage for more setup details.