2012 mct summit presentation final

MCT Summit North America | October, 17th – October 20th, 2012 | Redmond

Deep Dive into WinJS

Dmitri Artamonov

[email protected]

@dartamon

mailto:[email protected]


• Your name• Web, client or other?• What’s drawing you towards WinJS?

Introductions


• Introductions• Under the hood• Place in the universe• Patterns and practices• Integration with enterprise systems• Managing WinJS development

Agenda


• Language projections• Connected to same WinRT components• Hardware-accelerated JS technology from IE• Will WinJS evolve away?• Windows Phone 8

Under the hood


• Rapid Development• Reuse web monkeys• Better view surface on top of C# logic• Large existing ecosystem for developers• Cheaper UI design process

Where does it fit?


• jQuery• Graphing and Charting• Knockout.js• You can even create apps without WinJS

Other Libraries


• Async pattern• function – then – done• Still a single thread!• Careful accessing resources not yet returned

Patterns - Promises


• No encapsulation of actions• Bloated VMs• Implementation – one context per view• No two-way bindings in WinJS• Bindings in WinJS require knowledge of View

Patterns – MVVM…


• Standard web pattern for ~17 years• Controllers for user input• AM/DM conversion with namespaces and

classes• Classes and namespaces are observable• Multiple contexts – regions…

Patterns - MVC


Demo - MVC


• Data contexts defined for individual DOM elements

• data-win-bind and data-win-bindsource• Declarative and programmatic ways

Patterns - Regions


• Information hiding done via modules• Anonymous self-executing function with

parameters• Code inside module is private• Parameters allow dependency injection and

testing• Data exposed via namespaces and classes

Patterns – Modules and DI


• C# good at logic and model manipulation• Use it, expose data via component to WinJS• Access it as normal namespace/class• Take advantage of performance of C++/C#

Patterns – .winmd components


• Deploy once, keep updating• Forbidden by security for the Windows Store• Uses execUnsafeLocalFunction• Alternatives – iframe, Fragments API

Patterns - Dynamic code loading


• Blend with WinJS• No broken module references or .targets files• True handoff from designer to developer

Practices – Blend design process


Demo – Blend with Javascript


• File Picker API - fluid file system• Roaming API – unified experience• Share Contract – enterprise workflows• Tiles – enterprise dashboards• Windows Push Notification Services for

communication through tile updates

Integration with Enterprise Systems


Demo – Executive Dashboard


• Private store for the enterprise• Enterprise machines can deploy from fixed set

of apps• Enforce security policies• Restores controlled enterprise environment

Enterprise Store (unofficial)


• Training• Design – Blend!• Development• Testing• Deployment• Maintenance

Managing WinJS - Costs


• What happens to legacy C# apps?• How to migrate legacy web applications to

Windows 8?• Writing cross-platform apps

Managing WinJS (cont’d)


A Big Thanks to our Sponsors

Platinum Sponsor

Gold Sponsors


• WinJS Samples: http://code.msdn.microsoft.com/windowsapps/Windows-8-Modern-Style-App-Samples

• BlueMetal Blog: http://blog.bluemetal.com• [email protected]• @dartamon

Questions?

http://code.msdn.microsoft.com/windowsapps/Windows-8-Modern-Style-App-Samples



http://blog.bluemetal.com/

mailto:[email protected]

2012 mct summit presentation final

Technology

winjs mct summit north

c mct summit north america

winjs bindings

winjs samples

winjs access

winjs contd

enterprise enterprise

patterns modules