MVVM, MVC and MV* design pattern

What MVC is about?

MVC is about discipline.

MVC is about separation of concerns.

MVC is about modularisation.

MVC is about write tidy code.

MVC is about test.

We want the “discipline” of the “separation of concerns” from the MVC pattern. This facilitates modularisation of an application’s functionality and give as the structure to write “tidy” and “testable code”.

In other words we want to break that out. Make it more testable and easy to write and maintain.


Why using MVC architecture?

Patterns provide prescriptive guidance or pattern, like a it’s like a cookie cutter pattern, that can be used to build applications.

The benefit of this architecture is that each component plays its own separate role in making the application function as needed.

This pattern also allows developers to write presentation logic without needing to wait for designers to produce layouts and graphics for the application.

The separation of concerns in MVC facilitates modularisation of an application’s functionality


MVC as a Design Pattern

Design patterns are proven solutions to common development problems and can suggest structural approaches to help guide developers in adding some organisation to their applications.

Model-View-Controller is an architectural design pattern that encourages improved application organisation through a: separation of concerns. It enforces the isolation of business data (Models) from user interfaces (Views), with a third component (Controllers) traditionally present to manage logic, user-input and the coordination of models and views.


When using MV* pattern?

– When you application it going to scale

– When you have a very dynamic interaction with the users


The parts of the puzzle:

The idea is to break your application into the following three parts:

1. Models: manage the data for an application.
2. Views: display data to the user and read user input.
3. Controllers: format data for views and handle application state.


Parts jobs:


– I what the user see

– Responsable for rendering data

– Responsable dynamically generate HTML on the browser

– A view typically observes a model and is notified when the model changes, allowing the view to update itself accordingly.

– Users interact with views


– Mainly are going to be the f()
– Controllers act as the “brain” for a V
+ Defines properties ad methods
+ Handles showing/hiding controls and data in a V
+ handles events triggered by a V
+ Knows how to retrieve data


Modules are “Object Containers” for other components, it’s like a tupperware Container.


MVC frameworks:

JavaScript now has a number of populars MVC frameworks including AngularJS, Ember.js, JavaScriptMVC, KO.js and Backbone.js. Given the importance of avoiding evil “spaghetti” code, a term which describes code that is very difficult to read or maintain due to its lack of structure.



– AngularJS training – All you need to know about AngularJS –

– AngularJS jump start (Dan Wahlin) –

–, Google AngularJS doc page :

–, A better way to learn AngularJS:






Leave a Reply

Your email address will not be published. Required fields are marked *

* Copy This Password *

* Type Or Paste Password Here *