Yesterday we had the pleasure to present at TechDays 2012, with a session named “Windows 8 for Web Developers”. The topic of the presentation was how to develop Win8 Metro applications using HTML5, JavaScript and CSS3. Thanks to all of you that attended the session – we hope you enjoyed it as much as we did! :)
Below, you find the slides and also the links to many of the resources that we used when working on the presentation material. You find the code for the final demo here:
https://github.com/gustafnk/FeedReaderTechDays2012
The links
Resource sites
Microsoft Dev Center – Metro Style Apps
http://msdn.microsoft.com/en-us/windows/apps/br229512.aspx
Build 2011 on Channel 9 (Lots of great videos!)
http://channel9.msdn.com/Events/Build/Build2011
Blog posts
Introduction to developing Metro applications in HTML5
Stephen Walter has many nice intro posts on developing Metro applications with HTML5.
http://stephenwalther.com/
“What’s new in the Beta”
What’s New in the Beta Metro/JS Templates for VS11
http://www.sellsbrothers.com/Posts/Details/12716
Migrating your apps from Developer Preview to Consumer Preview
http://blogs.msdn.com/b/windowsappdev/archive/2012/03/08/migrating-your-apps-from-developer-preview-to-consumer-preview.aspx
What’s changed for app developers since //build/
http://blogs.msdn.com/b/windowsappdev/archive/2012/03/01/what-s-changed-since-build-part-1.aspx
http://blogs.msdn.com/b/windowsappdev/archive/2012/03/06/what-s-changed-for-app-developers-since-build-part-2.aspx
Tutorials
Create your first Metro style app using JavaScript (This is the tutorial that we based our final demo on!)
http://msdn.microsoft.com/en-us/library/windows/apps/br211385.aspx
How to cook a complete Windows 8 application with HTML5, CSS3 and JavaScript in a week
http://blogs.msdn.com/b/eternalcoding/archive/tags/windows+8/
Quickstart: adding a SemanticZoom
http://msdn.microsoft.com/en-us/library/windows/apps/hh465492.aspx
Technology specific posts
HTML, CSS, and JavaScript features and differences
http://msdn.microsoft.com/en-us/library/windows/apps/hh465380.aspx
Hands On: CSS3 Grid Layout (IE10 only)
http://ie.microsoft.com/testdrive/Graphics/hands-on-css3/hands-on_grid.htm
Quickstart: Using single-page navigation
http://msdn.microsoft.com/en-us/library/windows/apps/hh452768.aspx
Security contexts
http://msdn.microsoft.com/en-us/library/windows/apps/hh465373.aspx
Grouping and Semantic Zoom
http://debugmode.net/2012/03/21/listview-binding-with-grouping-and-semantic-zoom-in-windows-8-javascript-metro-application/
WinJS Promises: then and done
http://www.sellsbrothers.com/Posts/Details/12717
Making HTML safer: details for toStaticHTML
http://msdn.microsoft.com/en-us/library/windows/apps/hh465388.aspx
HTML AppBar control sample
http://code.msdn.microsoft.com/windowsapps/App-bar-sample-a57eeae9
Videos
Debugging your Metro style apps using HTML
http://channel9.msdn.com/Events/BUILD/BUILD2011/TOOL-514T
Introducing the Windows libraries for JavaScript
http://channel9.msdn.com/Events/BUILD/BUILD2011/TOOL-501T
Building Metro style apps using JavaScript
http://channel9.msdn.com/Events/BUILD/BUILD2011/TOOL-527C
WinJS Promises #1
http://mtaulty.com/CommunityServer/blogs/mike_taultys_blog/archive/2012/04/11/winjs-promises-1.aspx
Some issues we had
Blend For Visual Studio 11 get an error
http://stackoverflow.com/questions/9760643/blend-for-visual-studio-11-get-an-error
Trackbacks for this post