If you go ahead and start the blank application you will see a dark grey Metro app display. As you would expect, the blank application is just that, just the minimum. If you switch back to Visual Studio you will be able to see the debug environment as well as the DOM (Document Object Model) Explorer. Just as you would with a normal app, you can use the normal debug tools you would expect from Visual Studio.
Before we start modifying the project itself we will take a look at the breakdown of the solution and the components included.
The default.html is used at startup to define the markup for the main screen. Finally the package.appxmanifest is used to store basic information about the app such as name, icons, description, supported orientations, etc.
Next we can make a few simple changes to put some text on the screen and add a button. Within the body tag, insert the following markup:
<div style=”text-align:center;” padding-top: 50px”> Hello World!<br/> <input type=”button” value=”Submit” /> </div>
If you go ahead and run the app you will see a simple screen with the text Hello World and a single button as shown below.