OBJECTIVES
Define MVC and MVVM
Define and describe AngularJS
Discuss what you can do with AngularJS
Why MV*?
MV* are Architecture Patterns
Separation of concerns
Reusability
Easier to reason about
Design patterns for solved problems
Model
View
Controller
Model View Controller
Model
: Describes data; not the actual data in the database, but a description of the data in your app
View
: Presentation layer; templates and HTML
Controller
: Application logic; connects the Model and View; should be as thin as possible
MVC
Model
View
ViewModel
Model View ViewModel
AngularJS is an MVVM
Link MVVM with the idea of two way data binding
Model
: Still describes data
View
: Still the presentation layer
Controller
: Still there...
ViewModel
: A service (object) that "glues" the View to the Model
MVVM
What is AngularJS?
AngularJS
Provides a suite of functionality for common tasks
Front-end Framework
Standardized patterns
Designed to build SPAs
Single Page Application (SPA)
Loads views based on routes
Router manages routing
Can be URL or state driven
Vocabulary
Module
Controller
Routing / Route
Model
View
Controller
ViewModel
Component
Directive
Service
Factory
Provider
Dependency Injection
Big Picture
REVIEW
Compare and Contrast MVC and MVVM
What is AngularJS?
What is an SPA?
What is a module?
DEMO
Made with Slides.com