<commit_before>#TodoMVC - A Common Demo Application For Popular MVC Frameworks

Over the past year, we've seen interest in lightweight JavaScript MVC frameworks continue
to increase steadily. Backbone, Spine, SproutCore 2.0, YUILibrary, JavaScriptMVC...
the list of choices has never been so evergrowing and developers looking to select an 
option would be forgiven for feeling lost in a sea of what may appear to be (at face)
quite similar solutions.

In many cases it comes down to very subtle differences between these frameworks, so how 
do you choose exactly?. In my previous posts on structured application development I've
attempted to distinguish the pros and cons of such solutions, but when it comes down to
the MVC coding style they offer perhaps there's another way these differences can be 
compared.

##Introducing TodoMVC

You may know that many frameworks now come with their own variation of the 'Todo' example.
It's a simple demo that illustrates how models, views and controllers may be used to write
a completely functional list-based application. Whilst many frameworks do attempt to include
a version of the 'Todo' example, there are some problems here:

Implementations are inconsistant - there's no standard or specification around how the Todo
application should be written - indeed, some may ask if a demo app even needs one. Regardless,
This is why although some frameworks will implement the example with similar features and 
a look/feel consistant with their peers, others will stray away from this quite heavily. This 
is an issue because if you're attempting to directly compare how one framework might achieve
a task vs another, very disparate implementations make this significantly more difficult to do.

Some developers may claim that it's merely just adding or removing items from a list, there's not much more to it, is there?. When you actually delve into framework demos you might be surprised at just how much they can actually differ. Some solutions will opt for a completely different MVC structure to the application, others will opt for JavaScript templating to insert new items whilst some will prefer cloning HTML markup to insert new 'rows' instead. Again, the lack of what we consider a consistant experience causes problems here. 

Lack of a Todo example altogether - I can't speak for all developers, but after reviewing the feature list on such solutions, my first port of call is usually to look for their Todo app as I find this the quickest way to determine whether I'm going to like using their brand of MVC for structuring my apps. This isn't in any way stating an incapability of determining this from code samples in a frameworks docs, but rather, I prefer to review differences in a complete application. I know that other developers feel the same about this too.

So, I had an idea (which you may or may not find useful): 
Why not create a centralalized fork of the various framework Todo examples,
Attempt to make these Todo examples more consistant in features, look and feel
Add a Todo app for those that are missing one altogether or don't have an officially 'endorsed'
implementation. 

The initial result of my efforts is TodoMVC - a library of (almost) consistant Todo examples for MVC frameworks
which include:

SproutCore 2.0
Backbone.js
Spine.js
JavaScriptMVC
Sammy.js
YUILibrary
KnockoutJS (MVVM)

Code samples:
***coming soon

Screenshots:
**coming soon

All of the demos are completely self-contained, so in the case of say, a framework like 
JavaScriptMVC - not only are all dependencies included but the demo is also 'pre-compiled'
so you can try it out of the box (unlike the version on the official repo). I may also 
expand the example-set to include demos for other new libraries such as Batman.js and Agility
is these are requested.<commit_msg>Updating list formatting<commit_after>#TodoMVC - A Common Demo Application For Popular MVC Frameworks

Over the past year, we've seen interest in lightweight JavaScript MVC frameworks continue
to increase steadily. Backbone, Spine, SproutCore 2.0, YUILibrary, JavaScriptMVC...
the list of choices has never been so evergrowing and developers looking to select an 
option would be forgiven for feeling lost in a sea of what may appear to be (at face)
quite similar solutions.

In many cases it comes down to very subtle differences between these frameworks, so how 
do you choose exactly?. In my previous posts on structured application development I've
attempted to distinguish the pros and cons of such solutions, but when it comes down to
the MVC coding style they offer perhaps there's another way these differences can be 
compared.

##Introducing TodoMVC

You may know that many frameworks now come with their own variation of the 'Todo' example.
It's a simple demo that illustrates how models, views and controllers may be used to write
a completely functional list-based application. Whilst many frameworks do attempt to include
a version of the 'Todo' example, there are some problems here:

Implementations are inconsistant - there's no standard or specification around how the Todo
application should be written - indeed, some may ask if a demo app even needs one. Regardless,
This is why although some frameworks will implement the example with similar features and 
a look/feel consistant with their peers, others will stray away from this quite heavily. This 
is an issue because if you're attempting to directly compare how one framework might achieve
a task vs another, very disparate implementations make this significantly more difficult to do.

Some developers may claim that it's merely just adding or removing items from a list, there's not much more to it, is there?. When you actually delve into framework demos you might be surprised at just how much they can actually differ. Some solutions will opt for a completely different MVC structure to the application, others will opt for JavaScript templating to insert new items whilst some will prefer cloning HTML markup to insert new 'rows' instead. Again, the lack of what we consider a consistant experience causes problems here. 

Lack of a Todo example altogether - I can't speak for all developers, but after reviewing the feature list on such solutions, my first port of call is usually to look for their Todo app as I find this the quickest way to determine whether I'm going to like using their brand of MVC for structuring my apps. This isn't in any way stating an incapability of determining this from code samples in a frameworks docs, but rather, I prefer to review differences in a complete application. I know that other developers feel the same about this too.

So, I had an idea (which you may or may not find useful): 
Why not create a centralalized fork of the various framework Todo examples,
Attempt to make these Todo examples more consistant in features, look and feel
Add a Todo app for those that are missing one altogether or don't have an officially 'endorsed'
implementation. 

The initial result of my efforts is TodoMVC - a library of (almost) consistant Todo examples for MVC frameworks
which include:

<ul>
<li>SproutCore 2.0</li>
<li>Backbone.js</li>
<li>Spine.js</li>
<li>JavaScriptMVC</li>
<li>Sammy.js</li>
<li>YUILibrary</li>
<li>KnockoutJS (MVVM)</li>
</ul>

Code samples:
***coming soon

Screenshots:
**coming soon

All of the demos are completely self-contained, so in the case of say, a framework like 
JavaScriptMVC - not only are all dependencies included but the demo is also 'pre-compiled'
so you can try it out of the box (unlike the version on the official repo). I may also 
expand the example-set to include demos for other new libraries such as Batman.js and Agility
is these are requested.
{'fraction_non_alphanumeric': 0.03490627020038785, 'fraction_numerical': 0.0010342598577892696, 'mean_word_length': 4.618010167029775, 'pattern_counts': {'":': 0, '<': 19, '<?xml version=': 0, '>': 19, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1904342', 'n_tokens_mistral': 1927, 'n_tokens_neox': 1807, 'n_words': 1233}