Visual Studio for Front-End Development in 2018

Visual Studio, my high school sweetheart. It’s been a long time (>10 years) since I’ve even installed it, and after growing tired of the promise of the alleged awesomeness of HTML5 and all the mushy front-end web frameworks, I decided to look at Visual Studio again. WinForms are not so bad, right? I cut my teeth on Visual Basic 3.0 in middle school, and I fondly look back on those memories.

Visual Basic 3

The new Visual Studio journey will be documented here, from installation to app, through the eyes of two decades of corporate experience in everything BUT Visual Studio and Windows. I don’t even have an application in mind, I just want to play and explore (and maybe get an idea along the way). Since we are seeing Microsoft attempt to turn their image around into a user-friendly, design-friendly, open-source friendly (hello GitHub!) corporation, it will be an interesting experience.

VS

Installation

Grab a copy from https://www.visualstudio.com/. Which version do you need? Community, Professional or Enterprise? No idea. Typical Microsoft. Anyway, let’s go with the free Community Edition.

Installation is self-explanatory, I just picked tools I thought I needed, weighing in at 30+ GB of download (!)

First Run

After creating a project (C# -> Universal Windows Platform), the IDE complained that Windows needs be upgraded to Update 1083 to view the layout. Sigh. Another lengthy activity.

Sample Tutorial Project

Microsoft has a tutorial about creating a simple interface, and adaptive layouts. The code is shared on GitHub. Cool.

Be careful, ARM architecture is the default build target. I’m running on x64.

The tutorial calls for the app to be run on a device emulator, for example Windows Mobile, but VS doesn’t have that option. Instead, it has “Simulator, Local Machine, Remote Machine, Device”. Simulator doesn’t ever start up properly. Local machine is the only one that actually starts the sample app. “Download new emulators” brings me to a page where only Windows version emulators are available (no mobile devices).

After an hour or so of fiddling, many hours of downloading, I cannot even run the sample application the way Microsoft intended in their tutorial.

Fine, at least I can still run on “Local Machine”. Let’s look at the code.

The first thing that jumps out is:
The type or namespace name 'System' could not be found (are you missing a using directive or an assembly reference?)

Using System Error

Bonus: the error text cannot even be selected with the mouse.

Ugh. These errors are everywhere. According to this SO post, clean the solution and restart VS. This seemed to work.

Development

After a rocky start, we are ready to make a user interface. Let’s start by implementing a Reddit-like interface for Hacker News and iterating over it.

Next post, I’ll explore a very simple interface as seen below, with the ability to read from the official HN API.

hn_start

Leave a Reply