Este.js Todo MVC demo

The state of art TodoMVC example.

github.com/steida/este-todomvc

Why I created yet another TodoMVC demo?

• I consider Google Closure and Facebook React as great combo for fast and robust isomorphic apps.
• Closure Library is the most mature and battle tested library.
• Facebook React is clean and functional approach to build UI.
• I used Este.js dev stack based on gulp.js so you can start modifing example immediately.
• I wanted to demonstrate app architecture similar to Facebook Flux with best patterns I’m using on my projects.
• With Google Closure Compiler compiled app is tiny — 46 kB (gzipped).

Where I can find documentation, reference, etc.?

Learn Google Closure, React.js, Este Library. You should also know gulp.js.

Architecture notes

• Do not manipulate with models and collections directly, it’s task for Stores. We don’t need object observing. It’s anti-pattern.
• Stores dispatches change events, so React component can update itself via forceUpdate.
• URL’s are not hardcoded, instead este.Route instances are used. This is great pattern allows us to easily change, navigate, or create url across whole aplication.
• DI container is panacea for huge applications because we don’t have to write custom factories. Pattern is super simple. Just create class you need and consume it where you need. How? Use constructor parameter.
• Example uses static type checking. Even huge refactoring is safe now.
• Example consists of well tailored components, so you don’t need special MVC framework at all. Future belongs MVC meta-frameworks.
• Code is clean prepared for isomorphic application. For instance, you can reuse app.todos.Todo, app.todos.Todos, and app.Routes on Node.js based server.

Feel free to ask anything. Happy codding :-)

Update 1: I will have to update example with Flex and do some small refactoring.