Silverlight is dead! Long live MVVM! [email protected].
-
Upload
kacie-bowick -
Category
Documents
-
view
218 -
download
0
Transcript of Silverlight is dead! Long live MVVM! [email protected].
![Page 1: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/1.jpg)
![Page 2: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/2.jpg)
Silverlight is dead!Long live [email protected]
![Page 3: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/3.jpg)
A long time ago…
![Page 4: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/4.jpg)
… when all we had
were Win Forms…
![Page 5: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/5.jpg)
… Microsoft released
Silverlight/WPF
![Page 6: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/6.jpg)
What’s changed?
![Page 7: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/7.jpg)
Declarative UI (XAML)
![Page 8: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/8.jpg)
UI thread belongs to the UI
Your Weather App is not responding
![Page 9: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/9.jpg)
UI thread belongs to the UI
![Page 10: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/10.jpg)
Non absolute layouts
![Page 11: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/11.jpg)
MVVM & Data Binding
View Model
View Model
![Page 12: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/12.jpg)
MVVM – Model View ViewModelBoring diagrams
![Page 13: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/13.jpg)
Separated presentation
DomainObjects
View
Presentation Logic
![Page 14: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/14.jpg)
Different responsibilities
DomainObjects
View
Presentation Logic
User name cannot be empty
When user name entry is empty,
disable submit button
![Page 15: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/15.jpg)
MVVM - Structure
Invoke Commands
Change notifications
![Page 16: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/16.jpg)
DEMO TIME
![Page 17: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/17.jpg)
Old (ancient) idea
![Page 18: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/18.jpg)
View Model!=
Code Behind
![Page 19: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/19.jpg)
DEMO TIME
![Page 20: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/20.jpg)
This MVVM thing is pretty cool.
Silverlight RULEZ!
![Page 21: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/21.jpg)
Silverlight is D E A D !
![Page 22: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/22.jpg)
Silverlight is dead – O RLY?
• Silverlight 5 is a complete platform– Support through 10/12/2021
• WP 7.5/8• WPF
• Yup, it is pretty dead on the web…
![Page 23: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/23.jpg)
![Page 24: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/24.jpg)
![Page 25: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/25.jpg)
Domain Objects
Separated presentation in a browser
![Page 26: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/26.jpg)
View Model
View Model
MVVM in the browser
![Page 27: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/27.jpg)
1032 pages
172 pages
![Page 28: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/28.jpg)
View Model
View Model
MVVM in the browser
?
![Page 29: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/29.jpg)
Simplify dynamic JavaScript UIs by
applying the Model-View-View Model
(MVVM) pattern
Declarative
Bindings
Automatic UI
Refresh
Dependency
TrackingTemplating
![Page 30: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/30.jpg)
DEMO TIME
![Page 31: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/31.jpg)
KnockoutJS Demo
• MVVM pattern– Data binding– Observables– Commands
• Custom bindings
• Promises and Deferred objects
![Page 32: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/32.jpg)
Final (almost) thoughts
• Silverlight is dead (on the web)!
• JavaScript is here to stay… we need client side code…
• JavaScript has good parts– Object oriented– Functional– Dynamic
![Page 33: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/33.jpg)
Final thoughts• There is more to explore and learn
– HTML5, CSS3– REST, JSON– Web Sockets– Web Storage– Worker Threads– Canvas– Audio/Video
![Page 34: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/34.jpg)
Technology changes – focus on principles
![Page 35: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/35.jpg)
Knockout @ Making WavesActivity Feed (activityfeed.codeplex.com)
Forms Designer
![Page 36: Silverlight is dead! Long live MVVM! maciej.grzyb@makingwaves.pl.](https://reader036.fdocuments.net/reader036/viewer/2022062404/551bef26550346b9588b64f8/html5/thumbnails/36.jpg)