HTML and CSS Reference
In-Depth Information
Figure 1-6 shows the Visual Studio controls that control the execution of the Metro app in
the simulator. The first four start, pause, stop, and restart execution. These are the traditional
debugger controls that Visual Studio has had for as long as I can remember.
Figure 1-6. Controls for restarting and reloading the Metro app
The addition is the reload button, which I have highlighted on its own and which is to the
right of the other controls. Clicking this button quickly reloads the content of your Metro app
and immediately reflects any changes. You can see the effect of my HTML and CSS changes in
Figure 1-7 .
Figure 1-7. The Metro simulator now showing the HTML5 and CSS changes
It isn't just the HTML and CSS that are reloaded. The JavaScript for the application is
refreshed as well. This is a nice and quick way of getting an iterative write-and-test develop-
ment cycle going for Metro apps.
Debugging Metro Apps
Visual Studio has an excellent debugger, and it can be used very easily to track down problems in
JavaScript Metro apps. In my own application code, I find it easiest to add the debugger keyword to
my code. When the runtime encounters the keyword, the debugger breaks, and I can step through
my code, inspect variables, and execute little snippets of code using the JavaScript console.
Search WWH ::

Custom Search