#Microsoft

#Universal Windows Platform Tooling

Visual Studio is a very powerful, full-featured IDE. However, it includes support for a large number of features that a lot of web-developers (myself included) don't need. This results in a 4GB - 10GB install and very long start up times.

We wanted to remove friction from the Universal Windows Platform App development process. So I built some tooling to make the process more friendly to web developers.

#hwa

I created a CLI utility called hwa that allowed developers to launch their UWP's directly. Prior to this, the only simple way to debug UWP apps was through Visual Studio—something potentially unappealing to web developers.

This is particularly convenient for developers who are building apps with a remote start page. They can simply install the tool globally:

npm i -g hwa

And they can run

hwa

to load a 'Testbed' style app that allows them to dynamically change URLs, or if their app depends on having a specific URL as the origin, they can run:

hwa https://example.com

and if they want to include it in their build system (e.g. through an npm script), the module provides the following functions:

// import the module
import { updateStartpage, registerApp } from 'hwa';
// update the start page
updateStartpage('https://example.com');
// launch the app
registerApp();

The tool is currently used in both ManifoldJS and the AppX Yeoman Generator.

#AppX Yeoman Generator

Disclaimer: Several of the technical decisions made for this project are somewhat outdated. This is likely due to a combination of my personal growth as a developer and the rapidly changing web development landscape. The AppX Yeoman Generator is a Yeoman Generator aimed towards more beginner-level developers who are looking to write a UWP. Initially, I had created a few gulp tasks to create a demo Hosted Web App that was shown at Mobile World Congress.

My team decided that it would be good to create a project scaffold for developers interested in building apps for our platform and that we could use the demo app as a starting point. I ended up creating a Yeoman generator using the demo as a base. I also worked with the Channel 9 team to create an instructional video.

Looking back, the project could probably have been reduced to only webpack and a few npm scripts. However, at the time, the team wanted to accommodate beginner developers who were used to simply linking their assets in their HTML without having to modify the webpack config.