Tag Archives: TodoMVC

TodoMVC using Mojito, Part 2: Common affinity controller

TodoMVC using Mojito - Firebug Console

In Part 1, we got our basic application ready with the following setup:

  • Application and Routing Configuration
  • TodoMVC defined assets
  • Initial UI – HTML markup and CSS stylesheet

In Part 2, we explore configuring all of the CRUD actions and update all associated artifacts – model, controller and binder. Specifically, we explore the following actions – one at a time:

  1. Action – List all TODOs
  2. Action – Add a TODO
  3. Action – Edit a TODO
  4. Action – Mark one or all complete
  5. Action – Delete a TODO

Step 1: Action – List all TODOs

The first thing that we build up is retrieving all TODO items and showing them up. If there are no items in the list, then, as per the specs, the #main element must be hidden.

Let us start with updating the model followed by the controller and binder in that order.

Read more …

TodoMVC using Mojito, Part 1: Common affinity controller

TodoMVC using Mojito

This is first post in the series that describes building a simple Todo application using Mojito. The constraint that we have in our first implementation is that the controller will have common affinity.

As a prerequisite to understanding the implementation, I would assume that you are well versed with JavaScript and are hands on with Mojito. If not, it may be worthwhile to explore my initial posts on getting started with Mojito.

The complete code generated can be structured in the following steps:

  1. Initial code generation using Mojito CLI tools
  2. Application and routes configuration
  3. Initial UI – View and CSS
  4. Model
  5. Controller
  6. Binder
  7. Action – List all TODOs
  8. Action – Add a TODO
  9. Action – Edit a TODO
  10. Action – Mark one or all complete
  11. Action – Delete a TODO

Read more …

Todo MVC using Mojito

TodoMVC is an awesome project by Addy Osmani and Sindre Sorhus. In their own words:

Developers these days are spoiled with choice when it comes to selecting an MV* framework for structuring and organizing their JavaScript web apps.

Backbone, Ember, AngularJS, Spine… the list of new and stable solutions continues to grow, 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.

The website now boasts of implementations using over three dozen frameworks. And I decided to pitch in using Mojito by Yahoo!

Read more …