Windows 8 - View Source

Something that has been a huge help in my learning of Windows 8 App development has been the ability to get more of an idea of how other apps have been put together, particularly HTML5 apps.

Anyone with a web development background will have likely spent more time viewing the source of some websites than the actual website itself. This isn't a plagiarism thing, it is a learning tool and can be very valuable.

Fortunately, Windows 8 offers the same opportunity although it's not quite as easy as right click view-source and there are some limitations but it's still extremely useful.

Here are the steps to being able to dig through your installed apps.

Show Hidden Files and Folders

All Windows 8 apps get installed to a folder at C:\Progam Files\WindowsApps, by default this isn't a folder you can view so in order to see it you have to enable hidden files/folders. With Windows 8 this is dead easy, hit Start and simply type "Show Hidden", select the Settings results and then click on "Show hidden files and folders":

Then select the radio button from the properties window displayed:

Change folder ownership

You'll now be able to see the WindowsApps folder in C:\Program Files\ but you won't be able to access it because of a security restriction. You'll need to change the owner of the folder to be your login as follows:

1. Right click the WindowsApps folder and select "Properties"
2. Select the "Security" Tab
3. Click the "Advanced" button
4. Next to the "Owner" label click the link which says "Change"
5. In the dialogue that pops up, enter the username you sign into windows with (probably your LiveID) click "Check Names"
6. Confirm all of the open dialogues

Now you can explore the app packages you have installed!

What to look for?

For me, the first thing I found interesting was how difficult it was to tell between which apps were built using HTML and which were built using c#, poking around the WindowsApps folder lets you confirm this. That is a testament to the emphasis Microsoft have placed on making HTML/JS applications first class citizens. Even choosing to build some of the standard apps in HTML themselves. Apps such as Finance, News, Sports, Travel, Weather and so on!

As an app developer, this is also useful as you can look and see how other apps have been structured. For instance I discovered that Wordament is a single HTML page with a standard CSS file and different stylesheets for filled, portrait and snapped views. The logic source (javascript) of Wordament is minified and obfuscated but that is understandable as they wouldn't want to encourage cheating or risk their intellectual property.

Another interesting app to look at is the game Pirates Love Daisies by Grant Skinner, looking through this you can see just how much they were able to port directly from the existing web-based version. The entire source of this game is viewable so an excellent HTML/JS learning resource.

Being able to browse some of the source of Windows 8 apps is a great feature of Windows 8 and well worth spending some time doing for your favourite apps.