UWP: Making Your First UWP App Using HTML And JavaScript

How to make your first UWP Application using HTML and JavaScript ?

If you have had experience in HTML and JavaScript and always wanted to dive in Application Development, you’re at the right place. With the advent of UWP(Universal Windows Platform), you can now leverage what you have already learnt and make awesome applications for Windows Desktop and Mobiles. Without even wasting even a second, let’s jump right into the cool stuff.

Let’s make our first “Hello World” UWP Application using HTML and JavaScript.

Step 1: Open Visual Studio -> Click on File -> New -> Project. Then click on JavaScript -> Windows -> Universal and select Blank App(Universal Windows) Template, Give the Name and Path as you like and hit OK as shown below.

Step 2: You should see the following structure in solution explorer.

Step 3: Now open the index.html and view the contents of it. It should look something like this:

Step 4: Put whatever you want instead of “Content goes here!” (see highlighted part in the previous step). 

Step 5: That’s it! Now run the Application on Local Machine (your PC or Laptop) or on a Windows Phone and the results will be like this:

On PC/Laptop:

On Windows Phone:

You must be wondering how the application navigates to “index.html”. Well, just open the “package.appxmanifest” and have a look at it.You can see the Start Page points to the “index.html”. Likewise you can point to a local(Within your App) Web page or even a hosted Web Page(e.g. www.yourwebsite.com) and the application will open that Web Page when it launches.

As you can see, how easy and intuitive it is to develop an App using HTML and JavaScript on the Universal Windows Platform (UWP). I encourage you to explore more on this topic and stay tuned for more articles to follow. Cheers!

You can download the source code from the following link:

Download Hello World JS App