SlideShare a Scribd company logo
Deep Dive into WinJS

                   Dmitri Artamonov
                 dmitria@bluemetal.com
                       @dartamon




MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Introductions
 • Your name
 • Web, client or other?
 • What’s drawing you towards WinJS?




   MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Agenda
 •   Introductions
 •   Under the hood
 •   Place in the universe
 •   Patterns and practices
 •   Integration with enterprise systems
 •   Managing WinJS development



     MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Under the hood
 •   Language projections
 •   Connected to same WinRT components
 •   Hardware-accelerated JS technology from IE
 •   Will WinJS evolve away?
 •   Windows Phone 8




     MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Where does it fit?
 •   Rapid Development
 •   Reuse web monkeys
 •   Better view surface on top of C# logic
 •   Large existing ecosystem for developers
 •   Cheaper UI design process




     MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Other Libraries
 •   jQuery
 •   Graphing and Charting
 •   Knockout.js
 •   You can even create apps without WinJS




     MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Patterns - Promises
 •   Async pattern
 •   function – then – done
 •   Still a single thread!
 •   Careful accessing resources not yet returned




     MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Patterns – MVVM…
 •   No encapsulation of actions
 •   Bloated VMs
 •   Implementation – one context per view
 •   No two-way bindings in WinJS
 •   Bindings in WinJS require knowledge of View




     MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Patterns - MVC
 • 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…



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




MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Patterns - Regions
 • Data contexts defined for individual DOM
   elements
 • data-win-bind and data-win-bindsource
 • Declarative and programmatic ways




   MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Patterns – Modules and DI
 • 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


   MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Patterns – .winmd components
 •   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#




     MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Patterns - Dynamic code loading
 •   Deploy once, keep updating
 •   Forbidden by security for the Windows Store
 •   Uses execUnsafeLocalFunction
 •   Alternatives – iframe, Fragments API




     MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Practices – Blend design process
 • Blend with WinJS
 • No broken module references or .targets files
 • True handoff from designer to developer




   MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Demo – Blend with Javascript




MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Integration with Enterprise Systems
 •   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



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




MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Enterprise Store (unofficial)
 • Private store for the enterprise
 • Enterprise machines can deploy from fixed set
   of apps
 • Enforce security policies
 • Restores controlled enterprise environment




   MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Managing WinJS - Costs
 •   Training
 •   Design – Blend!
 •   Development
 •   Testing
 •   Deployment
 •   Maintenance



     MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Managing WinJS (cont’d)
 • What happens to legacy C# apps?
 • How to migrate legacy web applications to
   Windows 8?
 • Writing cross-platform apps




   MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
A Big Thanks to our Sponsors
                      Platinum Sponsor




                          Gold Sponsors




MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
Questions?
 • WinJS Samples:
   http://code.msdn.microsoft.com/windowsapps/
   Windows-8-Modern-Style-App-Samples
 • BlueMetal Blog: http://blog.bluemetal.com
 • dmitria@bluemetal.com
 • @dartamon




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

More Related Content

What's hot

Building a Better Web with HTML5 and CSS3
Building a Better Web with HTML5 and CSS3Building a Better Web with HTML5 and CSS3
Building a Better Web with HTML5 and CSS3
Karambir Singh Nain
 

What's hot (11)

Component Based Development
Component Based DevelopmentComponent Based Development
Component Based Development
 
BDD by example
BDD by exampleBDD by example
BDD by example
 
Ui technologies
Ui technologiesUi technologies
Ui technologies
 
Building a Better Web with HTML5 and CSS3
Building a Better Web with HTML5 and CSS3Building a Better Web with HTML5 and CSS3
Building a Better Web with HTML5 and CSS3
 
Introduction to NativeScript - BuildTruly Native Apps using JavaScript
Introduction to NativeScript - BuildTruly Native Apps using JavaScriptIntroduction to NativeScript - BuildTruly Native Apps using JavaScript
Introduction to NativeScript - BuildTruly Native Apps using JavaScript
 
Microservice intro
Microservice introMicroservice intro
Microservice intro
 
Introduction to Front End Engineering
Introduction to Front End EngineeringIntroduction to Front End Engineering
Introduction to Front End Engineering
 
Access.net presentation
Access.net presentationAccess.net presentation
Access.net presentation
 
Doktool
DoktoolDoktool
Doktool
 
An Unexpected Solution to Microservices UI Composition
An Unexpected Solution to Microservices UI CompositionAn Unexpected Solution to Microservices UI Composition
An Unexpected Solution to Microservices UI Composition
 
Make your own Pokédex with the Pokéapi & Node/Express!
Make your own Pokédex with the Pokéapi & Node/Express! Make your own Pokédex with the Pokéapi & Node/Express!
Make your own Pokédex with the Pokéapi & Node/Express!
 

Similar to 2012 mct summit presentation final

2012 MCT Summit Presentation
2012 MCT Summit Presentation2012 MCT Summit Presentation
2012 MCT Summit Presentation
Dmitri Artamonov
 
MongoDB Evening Austin, TX 2017
MongoDB Evening Austin, TX 2017MongoDB Evening Austin, TX 2017
MongoDB Evening Austin, TX 2017
MongoDB
 

Similar to 2012 mct summit presentation final (20)

2012 MCT Summit Presentation
2012 MCT Summit Presentation2012 MCT Summit Presentation
2012 MCT Summit Presentation
 
Private Cloud Self-Service at Scale
Private Cloud Self-Service at Scale Private Cloud Self-Service at Scale
Private Cloud Self-Service at Scale
 
Going MicroServices with Net
Going MicroServices with NetGoing MicroServices with Net
Going MicroServices with Net
 
AD109 Navigating the Jungle of Modern Web Development
AD109 Navigating the Jungle of Modern Web DevelopmentAD109 Navigating the Jungle of Modern Web Development
AD109 Navigating the Jungle of Modern Web Development
 
Latest trends in information technology
Latest trends in information technologyLatest trends in information technology
Latest trends in information technology
 
Microservices
MicroservicesMicroservices
Microservices
 
MongoDB Evening Austin, TX 2017
MongoDB Evening Austin, TX 2017MongoDB Evening Austin, TX 2017
MongoDB Evening Austin, TX 2017
 
Enterprise Trends for MongoDB as a Service
Enterprise Trends for MongoDB as a ServiceEnterprise Trends for MongoDB as a Service
Enterprise Trends for MongoDB as a Service
 
CAD Practices On the Cloud
CAD Practices On the CloudCAD Practices On the Cloud
CAD Practices On the Cloud
 
Wessel Loth - Fire your Frontend Framework with Lit - TEQnation 2022.pdf
Wessel Loth - Fire your Frontend Framework with Lit - TEQnation 2022.pdfWessel Loth - Fire your Frontend Framework with Lit - TEQnation 2022.pdf
Wessel Loth - Fire your Frontend Framework with Lit - TEQnation 2022.pdf
 
2019-Nov: Domain Driven Design (DDD) and when not to use it
2019-Nov: Domain Driven Design (DDD) and when not to use it2019-Nov: Domain Driven Design (DDD) and when not to use it
2019-Nov: Domain Driven Design (DDD) and when not to use it
 
Oracle OpenWorld 2017 Review (31st October 2017 - 250 slides)
Oracle OpenWorld 2017 Review (31st October 2017 - 250 slides)Oracle OpenWorld 2017 Review (31st October 2017 - 250 slides)
Oracle OpenWorld 2017 Review (31st October 2017 - 250 slides)
 
Dot net platform and dotnet core fundamentals
Dot net platform and dotnet core fundamentalsDot net platform and dotnet core fundamentals
Dot net platform and dotnet core fundamentals
 
Dark Energy, Dark Matter and the Microservices Patterns?!
Dark Energy, Dark Matter and the Microservices Patterns?!Dark Energy, Dark Matter and the Microservices Patterns?!
Dark Energy, Dark Matter and the Microservices Patterns?!
 
Your App Deserves More – The Art of App Modernization
Your App Deserves More – The Art of App ModernizationYour App Deserves More – The Art of App Modernization
Your App Deserves More – The Art of App Modernization
 
Your App deserves more – The Art of App Modernization
Your App deserves more – The Art of App ModernizationYour App deserves more – The Art of App Modernization
Your App deserves more – The Art of App Modernization
 
Entity Framework and Domain Driven Design
Entity Framework and Domain Driven DesignEntity Framework and Domain Driven Design
Entity Framework and Domain Driven Design
 
Domain Driven Design Big Picture Strategic Patterns
Domain Driven Design Big Picture Strategic PatternsDomain Driven Design Big Picture Strategic Patterns
Domain Driven Design Big Picture Strategic Patterns
 
Case Manager for Content Management - A Customer's Perspective
Case Manager for Content Management - A Customer's PerspectiveCase Manager for Content Management - A Customer's Perspective
Case Manager for Content Management - A Customer's Perspective
 
Modern Collaboration Development (Part 2)
Modern Collaboration Development (Part 2)Modern Collaboration Development (Part 2)
Modern Collaboration Development (Part 2)
 

Recently uploaded

Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo DiehlFuture Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Peter Udo Diehl
 
Structuring Teams and Portfolios for Success
Structuring Teams and Portfolios for SuccessStructuring Teams and Portfolios for Success
Structuring Teams and Portfolios for Success
UXDXConf
 

Recently uploaded (20)

ODC, Data Fabric and Architecture User Group
ODC, Data Fabric and Architecture User GroupODC, Data Fabric and Architecture User Group
ODC, Data Fabric and Architecture User Group
 
UiPath Test Automation using UiPath Test Suite series, part 2
UiPath Test Automation using UiPath Test Suite series, part 2UiPath Test Automation using UiPath Test Suite series, part 2
UiPath Test Automation using UiPath Test Suite series, part 2
 
Demystifying gRPC in .Net by John Staveley
Demystifying gRPC in .Net by John StaveleyDemystifying gRPC in .Net by John Staveley
Demystifying gRPC in .Net by John Staveley
 
Free and Effective: Making Flows Publicly Accessible, Yumi Ibrahimzade
Free and Effective: Making Flows Publicly Accessible, Yumi IbrahimzadeFree and Effective: Making Flows Publicly Accessible, Yumi Ibrahimzade
Free and Effective: Making Flows Publicly Accessible, Yumi Ibrahimzade
 
Behind the Scenes From the Manager's Chair: Decoding the Secrets of Successfu...
Behind the Scenes From the Manager's Chair: Decoding the Secrets of Successfu...Behind the Scenes From the Manager's Chair: Decoding the Secrets of Successfu...
Behind the Scenes From the Manager's Chair: Decoding the Secrets of Successfu...
 
Server-Driven User Interface (SDUI) at Priceline
Server-Driven User Interface (SDUI) at PricelineServer-Driven User Interface (SDUI) at Priceline
Server-Driven User Interface (SDUI) at Priceline
 
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo DiehlFuture Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
 
UiPath Test Automation using UiPath Test Suite series, part 1
UiPath Test Automation using UiPath Test Suite series, part 1UiPath Test Automation using UiPath Test Suite series, part 1
UiPath Test Automation using UiPath Test Suite series, part 1
 
Unpacking Value Delivery - Agile Oxford Meetup - May 2024.pptx
Unpacking Value Delivery - Agile Oxford Meetup - May 2024.pptxUnpacking Value Delivery - Agile Oxford Meetup - May 2024.pptx
Unpacking Value Delivery - Agile Oxford Meetup - May 2024.pptx
 
AI presentation and introduction - Retrieval Augmented Generation RAG 101
AI presentation and introduction - Retrieval Augmented Generation RAG 101AI presentation and introduction - Retrieval Augmented Generation RAG 101
AI presentation and introduction - Retrieval Augmented Generation RAG 101
 
Designing for Hardware Accessibility at Comcast
Designing for Hardware Accessibility at ComcastDesigning for Hardware Accessibility at Comcast
Designing for Hardware Accessibility at Comcast
 
Strategic AI Integration in Engineering Teams
Strategic AI Integration in Engineering TeamsStrategic AI Integration in Engineering Teams
Strategic AI Integration in Engineering Teams
 
Optimizing NoSQL Performance Through Observability
Optimizing NoSQL Performance Through ObservabilityOptimizing NoSQL Performance Through Observability
Optimizing NoSQL Performance Through Observability
 
Salesforce Adoption – Metrics, Methods, and Motivation, Antone Kom
Salesforce Adoption – Metrics, Methods, and Motivation, Antone KomSalesforce Adoption – Metrics, Methods, and Motivation, Antone Kom
Salesforce Adoption – Metrics, Methods, and Motivation, Antone Kom
 
Structuring Teams and Portfolios for Success
Structuring Teams and Portfolios for SuccessStructuring Teams and Portfolios for Success
Structuring Teams and Portfolios for Success
 
IESVE for Early Stage Design and Planning
IESVE for Early Stage Design and PlanningIESVE for Early Stage Design and Planning
IESVE for Early Stage Design and Planning
 
Intelligent Gimbal FINAL PAPER Engineering.pdf
Intelligent Gimbal FINAL PAPER Engineering.pdfIntelligent Gimbal FINAL PAPER Engineering.pdf
Intelligent Gimbal FINAL PAPER Engineering.pdf
 
WSO2CONMay2024OpenSourceConferenceDebrief.pptx
WSO2CONMay2024OpenSourceConferenceDebrief.pptxWSO2CONMay2024OpenSourceConferenceDebrief.pptx
WSO2CONMay2024OpenSourceConferenceDebrief.pptx
 
Agentic RAG What it is its types applications and implementation.pdf
Agentic RAG What it is its types applications and implementation.pdfAgentic RAG What it is its types applications and implementation.pdf
Agentic RAG What it is its types applications and implementation.pdf
 
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered QualitySoftware Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
 

2012 mct summit presentation final

  • 1. Deep Dive into WinJS Dmitri Artamonov dmitria@bluemetal.com @dartamon MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 2. Introductions • Your name • Web, client or other? • What’s drawing you towards WinJS? MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 3. Agenda • Introductions • Under the hood • Place in the universe • Patterns and practices • Integration with enterprise systems • Managing WinJS development MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 4. MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 5. Under the hood • Language projections • Connected to same WinRT components • Hardware-accelerated JS technology from IE • Will WinJS evolve away? • Windows Phone 8 MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 6. MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 7. Where does it fit? • Rapid Development • Reuse web monkeys • Better view surface on top of C# logic • Large existing ecosystem for developers • Cheaper UI design process MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 8. MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 9. Other Libraries • jQuery • Graphing and Charting • Knockout.js • You can even create apps without WinJS MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 10. Patterns - Promises • Async pattern • function – then – done • Still a single thread! • Careful accessing resources not yet returned MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 11. Patterns – MVVM… • No encapsulation of actions • Bloated VMs • Implementation – one context per view • No two-way bindings in WinJS • Bindings in WinJS require knowledge of View MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 12. MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 13. MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 14. MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 15. Patterns - MVC • 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… MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 16. Demo - MVC MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 17. Patterns - Regions • Data contexts defined for individual DOM elements • data-win-bind and data-win-bindsource • Declarative and programmatic ways MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 18. Patterns – Modules and DI • 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 MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 19. Patterns – .winmd components • 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# MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 20. Patterns - Dynamic code loading • Deploy once, keep updating • Forbidden by security for the Windows Store • Uses execUnsafeLocalFunction • Alternatives – iframe, Fragments API MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 21. Practices – Blend design process • Blend with WinJS • No broken module references or .targets files • True handoff from designer to developer MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 22. Demo – Blend with Javascript MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 23. Integration with Enterprise Systems • 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 MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 24. Demo – Executive Dashboard MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 25. Enterprise Store (unofficial) • Private store for the enterprise • Enterprise machines can deploy from fixed set of apps • Enforce security policies • Restores controlled enterprise environment MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 26. MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 27. Managing WinJS - Costs • Training • Design – Blend! • Development • Testing • Deployment • Maintenance MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 28. Managing WinJS (cont’d) • What happens to legacy C# apps? • How to migrate legacy web applications to Windows 8? • Writing cross-platform apps MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 29. A Big Thanks to our Sponsors Platinum Sponsor Gold Sponsors MCT Summit North America | October, 17th – October 20th, 2012 | Redmond
  • 30. Questions? • WinJS Samples: http://code.msdn.microsoft.com/windowsapps/ Windows-8-Modern-Style-App-Samples • BlueMetal Blog: http://blog.bluemetal.com • dmitria@bluemetal.com • @dartamon MCT Summit North America | October, 17th – October 20th, 2012 | Redmond

Editor's Notes

  1. Less training with web monkeys and designers who already know HTMLDesign process with blend actually worksDevelopment is easier and iterativeTesting can be easily done with dependency injection modulesDeployment is dead simple – Windows StoreMaintenace – just HTML/JS