Windows 8 Metro apps in JavaScript

Microsoft unveiled an overwhelming number of new tools and technologies for Windows 8 at the 2011 BUILD conference. The spotlight was on Windows 8 "Metro style" applications which can be written in C++, C#, VB.NET, and HTML5 + JavaScript.
 

We’re big fans of .NET business application development and everything we saw at BUILD renewed our enthusiasm for that path. But we’re always interested in alternatives and we want to go where you want to go. So Ward gave an HTML 5 / JavaScript talk at the October 2011 Silicon Valley Code Camp that explored the future of JavaScript on Windows. 

The language may be JavaScript but this isn’t Web development as we know it. Microsoft is promoting browser-less desktop apps that conform to a prescribed “Metro style” and are deeply integrated with the Windows 8 Runtime ("WinRT") via Microsoft’s "WinJS Library".

The centerpiece of the talk was the step-by-step evolution of a Metro RSS Reader app, starting from "file | new" and culminating in the two-page "Fancy RSS Reader" that looks like this:

There is not a lick of DevForce in this code sample.

Download

We've zipped the slides, app, and transcript into BuildMetroAppsUsingJavaScript.zip

The download includes:

• Ward’s PowerPoint slide deck. 
• The WinJS demo of a Metro-style RSS reader built from "file | new".
• The script for the talk, with step-by-step instructions and commentary.

The WinJS demo application zip consists of five parts, each building on the previous part:

1. Reading the feed and pushing post data into the HTML.
2. Adding a Metro DatePicker control and wiring it to filter blog posts by date.
3. Data binding the posts to the HTML with an HTML template.
4. Using the Metro ListView to display posts in a touch-enabled control.
5. Dynamically displaying separate HTML application pages with the WinJS fragment loader.

Ward is grateful to Microsoft’s Luke Hoban and Chris Tavares for the content and materials in this talk.

Related presentations

Ward’s PowerPoint deck is largely a condensation of their talks, culled from their two BUILD presentations:

Luke Hoban:  533T – Using the Windows Runtime from JavaScript
Chris Tavares: 501T - Introducing the Windows libraries for JavaScript

The code for the demo application was transcribed by Ward from the talk by Chris Tavares and Chris Sells. 

Please note that the demo app is written with the preview version of Windows 8 shipped at BUILD and may not work on future releases. What you see here is a snapshot of a moment in time. We will not update, maintain or support it. It’s here for your edification only.

Enjoy!