mvc, mvp and mvvm: a comparison of architectural patterns
DESCRIPTION
DPR305. MVC, MVP and MVVM: A Comparison of Architectural Patterns. Joe Homnick [email protected] HSI Knowledge. What This Session Is And What It Is Not. It is: An investigation of how different software architecture patterns relate to different Microsoft developer technologies - PowerPoint PPT PresentationTRANSCRIPT
![Page 2: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/2.jpg)
What This Session Is And What It Is Not
It is:An investigation of how different software architecture patterns relate to different Microsoft developer technologiesA what to use where discussion
It is not:An exhaustive architectural discussion of software patterns with a bunch of mental pontifications.
![Page 3: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/3.jpg)
Overview
What, why, how of Model-view-controller(C) or presenter(P) or View Model(VM) architecture patternsModel-View-Controller (MVC) pattern
ASP.Net MVC 3 exampleModel-View-Presenter (MVP) pattern
Web Forms/SharePoint exampleModel-View-ViewModel (MVVM) pattern
Silverlight exampleWhat to use where
![Page 4: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/4.jpg)
What is Model/View/(C or VM or P)
Patterns that describe a modular approach to software developmentModules include:
Model – DataView – Presentation LayerC or VM or P – Glue Logic
They are based upon a “Separation of Duties”Seen in many other types o,f system frameworks
How is this different from nTier development in the 90’s - anybody remember Distributed interNet Architecture (DNA)
![Page 5: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/5.jpg)
Why Model-View-(C or VM or P)
The Patterns all have similar goals, however, achieve them in different waysThe Patterns goals are to increase:
ModularityFlexibilityTestabilityMaintainability
![Page 6: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/6.jpg)
Model-View-Controller (MVC)
First described in 1979 for Smalltalk at Xerox PARCController is centerpiece that decouples the Model and ViewControl flow:
User interaction eventController handles event and converts it to a user action the Model can understandModel manages the behavior and data of the application domainThe View interacts with the Controller and Model to generate a user interface
![Page 7: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/7.jpg)
Client/Server (DNA) vs MVC
Controller
ModelView
Client-----------------------
Business Objects
Server-----------------------Business Objects
Data
![Page 8: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/8.jpg)
MVC Observer Pattern
Controller
ModelView
![Page 9: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/9.jpg)
demo
ASP.Net MVC 3
![Page 10: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/10.jpg)
Model-View-Presenter (MVP)
MVP originated in early 1990sMVP is a derivative of MVCTwo types of implementation
Passive ViewSupervising Controller
Presenter assumes the functionality of the MVC ControllerView is responsible for handling UI eventsModel becomes strictly a Domain ModelMore User Interface centric
![Page 11: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/11.jpg)
MVC vs MVP (Passive)
Presenter
ModelView
Controller
ModelView
![Page 12: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/12.jpg)
MVP – Supervising Controller Pattern
Presenter
ModelView
![Page 13: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/13.jpg)
SharePoint 2010 Developer Guidance
MVP Class Diagram and Flow of Execution for the SandBox Execution Model
![Page 14: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/14.jpg)
demo
MVP Using ASP.Net Web Forms
NameTitleGroup
![Page 15: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/15.jpg)
Model-View-ViewModel (MVVM)
Largely based on MVCSpecialization of the MVP pattern known as the Presentation ModelBuilt specifically for the WPF and Silverlight environmentsModel and View works just like MVCViewModel is a “Model of the View”
It extends the Model with Behaviors the View could useData Binding between View and ModelPasses commands between the View and Model
![Page 16: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/16.jpg)
MVP (Passive) vs MVVM
ViewModel
ModelView
Presenter
ModelView
![Page 17: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/17.jpg)
demo
MVVM Using Silverlight
NameTitleGroup
![Page 18: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/18.jpg)
What To Use Where
Model-View-Controller (MVC) patternASP.Net MVC 3 Disconnected Web Based Applications
Model-View-Presenter (MVP) patternWeb Forms/SharePoint, Windows Forms UI state logic already wired up
Model-View-ViewModel (MVVM) patternSilverlight, WPFTwo way data-binding
![Page 19: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/19.jpg)
ARC Track Resources
http://www.microsoft.com/visualstudio http://www.microsoft.com/visualstudio/en-us/lightswitch http://www.microsoft.com/expression/http://blogs.msdn.com/b/somasegar/http://blogs.msdn.com/b/bharry/http://www.microsoft.com/sqlserver/en/us/default.aspxhttp://www.facebook.com/visualstudio
![Page 20: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/20.jpg)
Resources
www.microsoft.com/teched
Sessions On-Demand & Community Microsoft Certification & Training Resources
Resources for IT Professionals Resources for Developers
www.microsoft.com/learning
http://microsoft.com/technet http://microsoft.com/msdn
Learning
http://northamerica.msteched.com
Connect. Share. Discuss.
![Page 21: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/21.jpg)
Complete an evaluation on CommNet and enter to win!
![Page 22: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/22.jpg)
Scan the Tag to evaluate this session now on myTech•Ed Mobile
![Page 23: MVC, MVP and MVVM: A Comparison of Architectural Patterns](https://reader035.vdocuments.us/reader035/viewer/2022062222/56815e8e550346895dcd1e40/html5/thumbnails/23.jpg)