Ok!, today we are
going to create a basic windows 8 clock app, the idea is to use nothing but web
technologies to get an app up and running
Windows 8 apps are
perfect for dashboards, reporting and apps which are all inclusive, so I
thought of making a basic one that shows a clock, its simple and shows the very
basics of app dev
So lets get started!
Step 1: Open VS
Step 2: Click create, new
project, Other languages, JavaScript, Blank App
Step 3: Enter your suitable project name
Step 4: This now creates the
standard project layout
Step 5: Lets change the
metadata of the project so its more meaningful, the display name and the
description
Step 6: Now
lets change the icon so it looks a bit snazzy, open the logo.png file and do whatever you like to it
Lets see how that looks!, press F5 then windows key, you can see the app as the last tile, ooooh shiny!
Step 7: In the default.html
create a new div to hold the clock, give it a class, we want to do the same
with the date so we can display some more information
Step 8: Now the magic, the JavaScript, open the JS file and add the following code, And viola, here we
go!, press F5
As you can see it’s
a bit unstyled so lets change that
Step 10: Open the default.css, you can see the file is prefilled with the various states allowed so you just need to add your CSS within this, make sure to apply the styles for the other view states of the app
Now press F5!, its just like magic, here is your clock all, simple and beautiful
Now get that bad boy in TFS and published and your ready to go!