HTML5 with JavaScript and CSS3 on my Windows Phone

From some time now I have been thinking about starting to program in HTML5 with JavaScript and CSS3. I must admit that until now I have not found enough time or motivation to do so.

Yesterday, while reading one of the articles on John Sonmez’s blog (link here) I was reminded about Jennifer Dewalt. She has decided to learn how to code by creating 180 websites in 180 days (link here), with no days off. She is quite a source of inspiration: instead of thinking over and over how to start doing something one should JFDI.

I have decided to learn how to program in HTML5 with JavaScript and CSS3 by creating a set of small Windows Phone applications. Since I have a full time job I will not be able to work each day on this personal project, but I hope every week I will do something new.

 Create a “Hello World” Windows Phone Application

Download and install Visual Studio Express 2013 for Windows from here. I have downloaded and installed the DVD5 ISO Image.

After installing Visual Studio Express 2013 for Windows and starting it, you will be prompted to sign in with your Microsoft account (you could create one if you do not have it).

WP_VS_StartUp

In order to crate a new Windows Phone App go to FILE -> New Project…, from Installed->Templates->JavaScript choose Blank App (Windows Phone) and click OK.

WP_VS_Project

Based on the template we have chosen, Visual Studio will create the following structure:

WP_VS_Project_Created

 

In default.html add the following text to the body:

<body class="phone">
 <p>Hello World! (from Luck)</p>
</body>

Compile the solution by pressing F6.

To run the solution there are two options:

1. Use the Windows Phone Emulator installed with Visual Studio

From Visual Studio just use one of the emulators and click run or F5.WP_VS_Emulator

2. Use a physical device in case you have one (I use my Nokia Lumia for this)

The first step is to connect your Windows Phone to the computer via an USB Cable. The phone has to be unlocked.

From the start screen of the computer, run Windows Phone Developer Registration 8.1:

WP_Register_Phone

Follow all the registration steps. At the end of registration you should get the following message: Congratulations! You have successfully unlocked your Windows Phone.

Back to Visual Studio, on the Run menu select Device and hit run or F5.

 

At this point the first Windows Phone 8.1 application should have been created and executed. This is the result:

 

WP_VS_Run

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s