TodoMVC

Introduction

Developers these days are spoiled with choice when it comes to selecting an MV* framework for structuring and organizing JavaScript web apps. Backbone, Spine, Ember (SproutCore 2.0), JavaScriptMVC... The list of new and stable solutions goes on and on, but just how do you decide on which to use in a sea of so many options?.

To help solve this problem, we created TodoMVC - a project which offers the same Todo application implemented using MV* concepts in most of the popular JavaScript MV* frameworks of today.

Solutions look and feel the same, have a common simple feature-set and make it easy for you to compare the syntax and structure of different frameworks so you can select the one you feel the most comfortable with.

Demos

• Backbone.js
• Backbone.js + RequireJS
• Ember.js
• JavaScriptMVC
• Spine.js
• Knockout (MVVM)
• Sammy.js

• Dojo
• Closure
• YUILibrary
• Knockback.js
• AngularJS
• Angular + PersistenceJS

• Ext.js
• Broke.js
• Fidel.js
• jQuery
• Vanilla JS

New In TodoMVC 0.3

• Dojo (MV*) app
• Closure (MV*) app
• Fixes and rewrites to existing apps including Ember.js, Spine.js and Backbone.js
• Updated jQuery-only app for those wishing to compare MV* vs. a version structured without it
• A new boilerplate for Todo apps
• Initial work on Todo apps integrated with back-end tech stacks (Backbone.js only for now)

Getting Started

You can get setup with TodoMVC in just a few short steps:

1. Download the latest release.
2. Run TodoMVC on a local server (using MAMP, WAMP or another suitable setup). You can then select an app to run using the 'Live demos' link to the left.
3. Browse through the Todo apps, examine their source and discover which framework you might feel the most comfortable working with.

Selecting A Framework

Once you've downloaded the latest release and played around with the apps, you'll want to decide on a specific framework to try out.

Study the syntax required for defining models, views and (where applicable) controllers and classes in the frameworks you're interested in and try your hand at editing the code to see how it feels using it first-hand.

Please ensure that if you're happy with this, you do spend more time investigating the framework (including reading the official docs, the source and it's complete feature list). There's often a lot more to a framework than what we present in our examples.

Getting Involved

Is there a bug we haven't fixed or an MV* framework you feel would benefit from being included in TodoMVC?

If so, feel free to grab the submit a pull request and we'll be happy to review it for inclusion.

Make sure you use the template as a starting point and read the application specifications to make sure your app meets the guidelines for our next major release.

Submit Pull Request»