- From Spaghetti Code to Ravioli Code
- Spaghetti Code and Ravioli Code Examples
- What Is MVC?
- What does MV* give us?
- MVC vs. MVP vs. MVVM
- TodoMVC: A Common Application For Learning And Comparison
- Suggested Criteria For Selecting A MV* Framework
- Top 5 MVC frameworks
- Backbone.js
- Ember.js
- Angular.js
- Knockout.js
- Batman.js
- RequireJS
6. The Main Problems:
Where the one block of code begins and
where the other ends?
Violates SRP (Single Responsibility Principle)
7. The Main Problems:
Where the one block of code begins and
where the other ends?
Violates SRP (Single Responsibility Principle)
Global scope pollution
8. The Main Problems:
Where the one block of code begins and
where the other ends?
Violates SRP (Single Responsibility Principle)
Global scope pollution
Violates DRY (Don’t Repeat Yourselt)
9. The Main Problems:
Where the one block of code begins and
where the other ends?
Violates SRP (Single Responsibility Principle)
Global scope pollution
Violates DRY (Don’t Repeat Yourselt)
Not easy to maintain, test and debug
35. Backbone.js:
Provides models with key-value binding and
custom events, collections, and connects it all
to your existing API over a RESTful JSON
interface.
36. The job of the controller tends to more be done
partially by Views and Routers
Views contain UI logic along with representing
data
38. Cons:
Lacks strong abstractions and leaves
something to be desired
The entire framework is surprisingly
lightweight and results in lots of boilerplate
The larger an application becomes, the
more this becomes apparent
41. Ember’s main features are its data binding
Objects can bind properties to each other, so the
objects are kept in sync
Automatically updates its views when data changes
Views usually written in Handlebars.js
46. Google’s offering
Data binding directly in HTML
Its data binding is bi-directional
Angular leaves you with much leaner controllers
and less JavaScript to write
47. Pros:
Very well thought out with respect to
template scoping and controller design
Has a dependency injection system
Supports a rich UI-Binding syntax to make
things like filtering and transforming values
a breeze
56. Written in CoffeeScript
It can be used with JavaScript or CoffeeScript
Your code will look much cleaner in CoffeeScript
Wrapper class includes Controller and Models
Batman uses data-bindings in the Views
69. Go Deeper:
www. infoq. com/ research/ top-javascript-mvc-frameworks
todomvc. com
backbonejs. org
emberjs. com
angularjs. org
knockoutjs. com
batmanjs. org