Month: September 2015

Visual Studio Code – Why?

All Articles in series
Visual Studio Code Why?
Installing Visual Studio Code on OSX – From Scratch

Visual Studio Code – Why?

I am a Microsoft developer. I have been for over 10 years, since Visual Basic was first released.

This article is the first in a series an introducing to the latest Developer product from Microsoft (still in beta at the time of writing) – Visual Studio Code. This wonderful piece of software runs on Windows, Linux and OSX. As I use an Apple MacBook Pro as my workhorse the potential for this is like suddenly discovering the wheel – it’s really is going go be a revolution!

But why? And perhaps more importantly WHY do I use a MacBook when I am a professional Microsoft developer!?

Originally I wasn’t a professional developer – it was a hobby – but it was something I always knew in my heart I wanted to be.

Unfortunately when I started working the opportunities weren’t really around – at least not where I lived in the North of England.

And so I did the next best thing – I became an IT consultant – and I focussed on Microsoft products – Windows 3.1 and Windows NT.

The point is, since then I have been Microsoft through and through. So I often ask myself why I own an iPhone, and 4 iPads, and two years ago I bought a MacBook Pro.

All I can say is the hardware is just gorgeous. The OS to some extents doesn’t really bother me that much – which is odd considering my professional focus!. But then actually, if I think about it, it DOES make sense as for the past 10 years my development career has been about Web Development – which at the back is IS Microsoft (.NET) but for the end user is actually just HTML – and therefore OS agnostic.

In 2012 I needed a new laptop. I wanted a nice screen – after all I spent my days staring at a screen all day long as I wrote code – and the MacBook Pro with Retina display just ticked all the boxes. I also wanted something thin, light and powerful. At the time the ONLY thing on the market was the MacBook. Before then I’d never used a Mac, but now I could’t imagine NOT using a Mac. I wonder if it’s because deep down I’ve always been a bit artistic – and Apple (at least originally) has always attracted the more artistic types because of the aesthetics of its products.

But this left me with a quandary. I was a Microsoft developer! And so for the past few years I’ve used Windows Virtual Machines running on my Mac. I hardly ever touched OSX at all! It was simply the shell for running my VMs.

Actually this worked really well – as being a developer you often have to build and rebuild your OS as you install various tools, then uninstall them or upgrade them. And using VMs makes this process sooo much easier!

And then there is the plain and simple fact that as a developer I need to understand various diverse platforms – Windows, OS X, Android, iOS. In fact in my current position I am involved with a number of applications that use iOS applications that talk to a .NET back end. This pretty much sealed the deal – by using a MacBook with Windows VMs in top I really could have my cake and eat it!

So then Visual Studio comes along. And now I have a reason to be a Microsoft developer AND an OSX user. Again the question – WHY? Well first of all the fact that with ASP.NET 5 and Mono I can actually build applications using Microsoft .NET but deploy them to Linux/Unix – which tend to be a bit cheaper to host – not to mention the exciting possibilities Docker is giving.

Yes, Docker is now available on Windows, and IIS in the latest version of Windows so much faster and has a much smaller memory overhead (not to mention how much faster it can spin up) – but there’s something about the flexibility of being able to deploy to either Windows OR Linux that gets me excited – I can’t help but feel that this, combined with Docker, is going to be a game changer in the industry.

And so the potential to build software completely on OSX, Windows or Linux, using the same code base? Well now I’m feeling the sort of excitement lottery winners feel when they see there numbers come up! Sad, I know.

But now here’s a problem. I’m a Microsoft developer, ex Microsoft OS consultant, and i’ve just been using OSX as a shell for my Windows VMs. I know practically NOTHING about OSX and more importantly the underlying Linux OS that OSX is built on. I’ve seen the past few months playing with VS Code, and I finally think I’m starting to get to grips with it!

So this series of articles is really about my experience installing, setting up, and building full .NET websites using VS Code, .NET 5 and mono. All on an OS i don’t really know, and using technologies (like bower, nodejs, nopm, grunt, gulp) that I’ve never had to really worry about before (because Visual Studio just DOES IT for you!).

I hope you enjoy the series, and gleam some benefit from it!

The first article in the series – installing VS Code and it’s dependencies can be found here
Installing Visual Studio Code on OSX – From Scratch

Installing Visual Studio Code on OSX – from scratch!

All Articles in series:
Visual Studio Code Why?
Installing Visual Studio Code on OSX – From Scratch

Installing Visual Studio Code

This guide will assume a complete clean install of OSX. That means that I will cover every single pre-requisite that is required. I will also assume the reader has not much experience with OSX – if you are coming from a Windows .NET development background installation of many of the pre-requisites are not as straight forward as you’ll be used too!

Installing Code

First of all – the easy bit. Installation of the main Visual Studio Code program.

Go to https://code.visualstudio.com the website will detect you are running OSX, Windows or Linux and present you with the relevant link. Simply click the link to download the program.

This will download Visual Studio Code.app.

This is a self contained program and doesn’t require any installation. But lets move it from the default download location – which should be downloads – to the apps folder. Simple drag from the download folder onto the app folder in your Dock (if you’ve created a shortcut for it) or to the Applications folder in finder.

Now run the program by going into Applications (from finder or the Dock) and clicking it. The first time you run it you’ll be prompted to open the file as it was downloaded from the internet. Just click Open.

If you want it to be always in the Dock, right click the Icon choose options and ‘Keep In Dock’.

Another useful option for launching VS Code is to enable launch from a Terminal window. On OSX a lot can and will be performed through terminal so it’s hand to be able to simply type ‘code .’ and have it launch.

To set this launch Terminal by going to the Applications folder, then the Utilities folder and clicking ‘Terminal’. Again once running it will be handy to create a shortcut to it by right clicking it and choose Options->Keep In Dock.

What we need to do is edit a file called –bash_profile – this is like a startup file that you can use to set environment variables and things. It is also hidden. So to edit it in the Terminal window type nano ~/.bash_profile

You will be presented with a blank screen (unless you’ve installed some software that has already put some info in this.

Enter the following

code () {
if [[ $# = 0 ]]
then
open -a "Visual Studio Code"
else
[[ $1 = /* ]] && F="$1" || F="$PWD/${1#./}"
open -a "Visual Studio Code" --args "$F"
fi
}

Now press CTRL+O and accept the default filename to save the changes. Now press CRTL+X to exit nano.

Normally this script will execute on startup, but to run it now type

source ~/.bash_profile

so now if you type (with the period)

code .

VS Code will launch.

Node.js & NPM

Node.js is a JavaScript runtime execution engine. Using it you can create JavaScript applications. It is also used when building applications in VSCode to automate tasks.

Node also includes a utility called NPM – Node Package Manager. NPM is like NuGet – we can use it to install software and update software.

We will be using NPM a lot, so the next thing we need to do is install Node.

In a browser navigate to

http://nodejs.org

On the main page you will be presented with the current release of Node.js for your OS. Click the link to download the installer which be called something like node-v0.12.7.pkg (the actual name will vary depending on what the current version is). Simply run the installer by double clicking it.

In the dialog that appears click continue, then accept the license agreement, then click the install button.

Once installed you’ll be presented with a box telling you to make sure /usr/local/bin is in your path – this is so it can be executed from anywhere.

On a default OSX installation this is already set. You can confirm this by typing echo $PATH in the terminal window.

To confirm everything is working as we need now type the following

node

this will ‘launch’ nodejs and you’ll see a ‘>’. Now type

console.log(‘node is working’)

If it’s working ‘node is working’ should be output to the window. You’ll also see ‘undefined’ appear – don’t worry about that.

To quit out of node press CTRL+C twice.

Mono

The next piece of software we need is Mono. Mono is an open source implementation of .NET. Basically this means it allows you to run .NET applications on Linux and OSX based systems!

To install Mono in a browser navigate to

http://mono-project.com

Again the front page will have a link to download Mono. Click the link then double click the .pkg file that is downloaded to start the installer.

Click continue, accept the License agreement and click install.

.NET Execution Environment (ASP.NET 5)

Now we have Mono, we can install the ASP.NET 5 runtime itself. This has to be done via a terminal Window and in stages. So launch terminal (if it’s not already running).

First install the .NET Version Manager (dnvm). To do this in terminal type the following

curl -sSL https://raw.githubusercontent.com/aspnet/Home/dev/dnvminstall.sh | DNX_BRANCH=dev sh && source ~/.dnx/dnvm/dnvm.sh

This will download dnvm and automatically update your .bash_profile with the required environment settings.

Now we can use the dnvm to install or upgrade .NET Core Clr– known as the .NET Execution Environment (DNX) – by typing the following

dnvm upgrade -r coreclr

Finally, we must install DNX for Mono by typing

dnvm upgrade -r mono

The final step is we need to update our .bash_profile again. We need to ensure dnvm and dnu commands in our path, and also enable a setting to fix a IOException that we get with Mono and .NET

So again in terminal edit our profile like we did before with

Nano ~/.bash_profile

Make sure you have a reference to the dnvm.sh – it will either simply have source dnvm.sh, or a longer more verbose version.
After that line then add

Export MONO_MANAGED_WATCHER=disabled

Save the file by pressing CTRL+O

Then quit out with CTRL+X

Bower

The final software we need to install is called Bower. Bower is another package manager – like NuGet – but specifically for Web Projects.

We install Bower using NPM (The Node Package Manager). From a terminal window type the following