• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Communauté .NET Montréal Windows 8 camp - 2012-05-12 - Building metro style apps with html & javascript

Communauté .NET Montréal Windows 8 camp - 2012-05-12 - Building metro style apps with html & javascript






Total Views
Views on SlideShare
Embed Views



0 Embeds 0

No embeds


Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment
  • Let’s put this topic into context…
  • You are here !!
  • The new Microsoft web platform began with IE9 … we did a lot of work to catch up to HTML5 standards.. And all of that work will pay up in Windows 8..
  • Of course in Windows 8, we are adding more.. We will get into the details of these in the next few slides where we highlight most relevant ones
  • One or more of these, bold is preferred. CSS CSS Hands-on:http://ie.microsoft.com/testdrive/Graphics/hands-on-css3/Grid system: http://ie.microsoft.com/testdrive/HTML5/GridSystem/Default.htmlGradient Editorhttp://ie.microsoft.com/testdrive/Graphics/CSSGradientBackgroundMaker/Default.html
  • Choose two or three of the many demos we have on the IE 10 testdrive site. Try to end up on a high/graphical note.. Like the touch demo..Ecmascript5http://ie.microsoft.com/testdrive/HTML5/TryStrict/Default.htmlFormshttp://ie.microsoft.com/testdrive/HTML5/Forms/Default.htmlTouchhttp://ie.microsoft.com/testdrive/Graphics/TouchEffects/Web workershttp://ie.microsoft.com/testdrive/HTML5/WebWorkerTest262/Default.html
  • File New Project in Visual Studio Intellisense on Javascript.. Demonstrate Simulator Demonstrate DOM explorer using the simulator.. Set a breakpoint in the Debugger … a good place for this is the navigated event in navigator.js Open Javascript console .. Now type vardlg = new Windows.UI.Popups.MessageDialog("test") ; dlg.showAsync().then ( function () {} ) ; Comment out that this is the same text we used earlier.. Notice the javascript syntax in showAsync.. Tease the audience.. Will this work? Injecting a statement? Open Contoso Recipes in Blend .. Make sure this is a copy for this session. You don’t want your changes preservedDemonstrate how blend uses live data … Explain the solution is data driven, yet it is all showing. Style something, demonstrating that blend is great for styling.. Drag a control somewhere into layout..
  • Demonstratecontoso recipes application Show the use of the module pattern in javascript… Show the use of a promise.. Show the navigation Show the WinJS.application object To see all of these, it is trivial to do a search on the solution for //DEMO:WinJS and you will be able to see areas to set breakpoints for discussion..
  • If you prefer to use your own library, you can. As long as your app is compliant with Metro SDK, you will be fine.. At build, we explicitly wrote a sample (finance) using jQuery… It works very well.. If you are bringing your own library, here is the advise that I can give you:Mix & Match works fine. WinJS does a lot of things well, such as simplifying the object model, wrappers for file system, implementing the promise pattern, etc.. Use WinJS for all of that.. Use your favorite library for everything else, but do try to adhere to the Metro UI and the Windows personality. Your users will appreciate it if you do..

Communauté .NET Montréal Windows 8 camp - 2012-05-12 - Building metro style apps with html & javascript Communauté .NET Montréal Windows 8 camp - 2012-05-12 - Building metro style apps with html & javascript Presentation Transcript

  • demo
  • demo
  • demo
  • demo
  • http://www.ietestdrive.com/Links/DevGuide9.html http://www.ietestdrive.com/Links/DevGuide10.html http://blogs.msdn.com/b/ie/archive/2011/09/20/t ouch-input-for-ie10-and-metro-style-apps.aspx
  • http://www.ietestdrive.com/Links/DevGuide9.htmlhttp://www.ietestdrive.com/Links/DevGuide10.html