Exercising On The Promise of Cross Platform Development

The release of Visual Studio Code as a new Microsoft product has been a welcoming change for me, mainly because now I have a means to develop on both: Mac & PC. I am finding that I am often developing the same code on my MacBook Pro while on the go or back at my desk on my Windows PC. Note that this setup may also apply to Linux systems, but I have not delve into that one yet…
In this post I will walk through what I have been doing to reduce the friction of switching between Mac and Windows while developing cross platform applications using .NET Core.
Prerequisites
There are a number of prerequisites that you will need to setup in order to develop in a cross platform machine environment.
Windows
Mac
- Homebrew http://brew.sh *
Mac & Windows
- .NET Core https://www.microsoft.com/net/core
- Visual Studio Code (VSC) https://code.visualstudio.com/
- Visual Studio Team Services (VSTS) account https://www.visualstudio.com/en-us/products/visual-studio-team-services-vs.aspx
Note that we will be leveraging GIT and VSTS in order to easily share the code between machines once we have the tooling in place.
- We will leverage Homebrew on the Mac in order to install all of the prerequisites needed for creating and running ASP.NET Core applications such as http://yeoman.io/ on the Mac.
Setup & Installation
We will first start by setting up a new project in VSTS and we will use Git as our source code control engine of choice. By doing this we can easily clone the projects we work on and push the changes for Mac and Windows to be shared.
Brewing up in Mac
I will not delve into the installation of .NET Core as this is already well documented here: https://www.microsoft.com/net/core However, as you will notice the suggested method to install .NET Core on Mac is through the use of the Homebrew package manager. If you follow that link to the Homebrew homepage they will tell you to run the following command and watch it brew up some goodness:
/usr/bin/ruby -e “$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)”
Once you have Homebrew installed you can run this command from a Mac terminal to make sure things are All OK:
brew doctor
If all is well, you will get a message that says: Your system is ready to brew. Getting Homebrew installed is not just a requirement for .NET Core, it is actually also an excellent way to install the rest of the dependencies you will need for any development task on your Mac using .NET Core. With that said, I suggest you follow the rest of the installation documents for .NET Core on Mac & Windows before moving forward.
Now you will create a sample ASP.NET application that we can then push to our repository and clone it in a Windows environment. .NET Core offers command line tooling that makes is simpler to create applications by leveraging scaffolding generators such as http://yeoman.io/ The process for doing so is again well documented in the ASP.NET Core documents site: https://docs.asp.net/en/latest/client-side/yeoman.html#install-node-js-npm-and-yeoman You can follow those docs if you want to know more about how to generate ASP.NET Core projects, for brevity purposes of this post I will not dive into much detail on that.
Last but not least, install Visual Studio Code on both Mac & Windows.
Setting up a Git Repository in VSTS
If you have not already signed up for your free developer account for VSTS, you can do so now by going to https://www.visualstudio.com/en-us/products/visual-studio-team-services-vs.aspx
Once you have an active account, you can create a new project. For this sample I have created a new project called CrossPlatformAppSample.
Now we need to clone our repository into our Mac, we will then add an ASP.NET Core project to the repository and push our new code. However, in order to clone the repository we will have to first authenticate to it in a secure manner. Thankfully, there is an open source tool that works with VSTS and Git on Mac/Windows in order to provide a secure way to work with a repository without having to always provide credentials for each session: https://github.com/Microsoft/Git-Credential-Manager-for-Mac-and-Linux/blob/master/Install.md If you are really interested in how the tool works, you can look at the code in GitHub, but suffice it to say that the reason this is a preferred tool is because your Git credentials will be stored on the Mac’s Keychain when you first authenticate, thus making it more secure than saving your credentials in some insecure file or having them be prompted to you every time you connect. Under the covers the tool uses an OAuth2 flow to get the proper token and authenticate you to VSTS, this is indeed a very nice security feature that leverages open security protocols.
So this is where Homebrew comes in handy, just run this command from a terminal and you will be able to install the tool:
brew install git-credential-manager
Note that you will need to have Java installed in order for the Git Credential Manager tool to be installed. (Talk about cross platform/language here!) But in case you don’t, Homebrew will ask you to first run the command to install Java on your Mac:
brew cask install java
Once that succeeds, run the Git Credential Manager Tool in installmode :
git-credential-manager install
Your tools should be all set, now let’s create the sample project.
Creating The Sample App
By now you should have all the tools in place to create a new ASP.NET Core project. First create a new directory to clone your repository into, in my case I created a new folder called MySampleApps and navigated to it:
mkdir MySampleApps
cd MySampleApps
Clone
Now clone the empty repository into that folder, you will then add the new ASP.NET Core project there and commit the source code:
git clone https://{YOUR_PROJECT_URL}.visualstudio.com/DefaultCollection/_git/CrossPlatformAppSample
The first time you clone the repository you will get a prompt for your VSTS GIT token credentials, once you enter them once, your credentials will be saved in your Mac’s Keychain and you shouldn’t see any more prompts.
Yeoman Generator
Now run the following command to generate a sample application:
yo aspnet –grunt
Choose a simple template, the Web Application Basic [without Membership and Authorization] will suffice for this sample:
I then chose the Semantic UI from the menu choices, you can choose whichever one you like:
Give it a name, in my case I named it *MyCrossSampleApp *:
Press Enter and watch Yeoman generate the app for you:
Dive into that directory and restore any package dependencies and run the application by running the following commands from the console window:
cd MyCrossSampleApp
dotnet restore
dotnet run
Then navigate to the local server URL, usually http://localhost:5000 and you should see the application running:
Publishing to VSTS
So now you need to commit your new sample application to Git and push the changes to VSTS. But before we do that let’s take a peek under the hood at the generated project using VSC. Simply navigate to the root of the folder where you cloned the Git repository, you should be able to see the sample application in there:
Note that if this is the first time you access the cloned repository you will get a prompt for your VSTS credentials, that is the ***Git Credential Manager for Mac and Linux (GCM4ML) ***tool at work. Subsequently when you access the project folder again using VSC you will not get the prompt since your credentials will be encrypted and stored in the Mac’s Keychain, a very nice secure access feature.
Notice also that in VSC we have Git integration, this is going to allow us to easily commit to the remote repository and then push our changes. This is all coming together nicely now, let’s commit the initial code:
once you commit the code locally, you can just publish the branch, in this case ‘master’, to VSTS. There is a handy tool shortcut at the bottom of VSC for this:
And just like that all your code is now in VSTS, ready to be shared with a Windows client:
Running On Windows
Now you need to clone the same repository into your Windows client. Note that by now you should have already installed the equivalent tooling for developing ASP.NET Core apps in Windows, getting a secure clone from VSTS using the GCM4ML tool and you have your VSC ready to view your code.
If so then you will see that you can successfully clone the repository to a directory of your choice:
Then from the MyCrossSampleApp directory in our local repository, we run the same commands to restore packages if needed and run the application:
dotnet restore
dotnet run
The project compiles and the web server starts without a hiccup!
In my case the application can be access on http://localhost:5000 , same as Mac! :
The code can also be accessed using VSC from Windows:
I should add that full intellisense is available for the sample project using VSC:
Summary
The promise of cross platform development is holding true, at least for my tests in Mac and Windows, but even then this is a tremendously great feat to pull off. Kudos to Microsoft and all the people involved in making cross platform development a reality. Beyond any doubt accomplishing this was not easy, but I am thankful that it was done, as this style of development will reduce a lot of friction for me (and many others) whenever I switched between platforms/machines/OS.
Until next time, happy cross platform development!!!