Microsoft and open-source software: welcome!

Until recently, it was out of the question that Microsoft would cooperate with the Open-source community. Today, this situation has changed radically, and so it came as no surprise that the TechDays programme contained many sessions on open-source topics. What has changed? And will this relationship last?

This year, the Microsoft TechDays programme covered an impressive number of topics. The sessions that caught my interest in particular centred on the following:
• Microservices (including bus technologies)
• Open source software (Angular2, JS tools)
• New .Net features (e.g. C# 7, .Net Core and ASP.Net Core)

In addition to the regular Microsoft fare like .Net, Azure and DevOps, the TechDays programme covered topics not specifically relating to Microsoft, like front-end technology, the IoT, SCRUM, open-source software and robotics.

In order to keep this article concise, it is part of a series of three separate articles. This is the second part, about open-source software.

Open-source software

A few years ago, Microsoft viewed the open-source community as ‘the enemy’. Making the .Net source code available on the internet was out of the question, and the concept of free software was not in line with Microsoft’s company policy.

The company’s view has changed radically since then. So, it was not a big surprise to see that the TechDays programme included many sessions on open-source matters. And, it would seem, a lot of developers are drawn to this topic, with many of these sessions filled to capacity. I feel this is a good thing too. For example, when building web applications, this inevitably involves writing HTML, CSS and JavaScript code. This can be done in Visual Studio, but the use of additional open-source tools makes life much easier.

Out of the box Visual Studio supports editing HTML, CSS and JavaScript files, but if you want to use LESS, SASS or SCSS for your styling, you will need an extension or an open-source tool to transpile these files into CSS. These days, transpiling TypeScript (if that is how you like to write your JavaScript code) is supported in Visual Studio; however, running unit tests for your client side app also requires an extension or an open-source test runner framework (especially when using a highly customised framework like AngularJS). You will soon find yourself on the command line typing npm commands to retrieve packages like Mocha, Jasmine, Karma or QUnit. I was very pleased to perform a ‘restore npm packages’ operation in Visual Studio for the first time, and run a gulp task from the ‘Task Runner Explorer’. Both operations can be performed with a single mouse click. Nice!

Another pleasant surprise was the introduction of the Bash shell on Windows 10, as mentioned by Jeff Burtoft. For example, if you prefer to use the Git Command Line Interface you will need a UNIX-based shell. You could use CygWin if you like, but Windows 10 now provides another solution. This also makes it possible to use a wide range of Linux-based tools without having to run Linux on your device. The Bash shell is turned off by default, but it’s available as a Windows feature and it’s quite easy to turn on. If you would like to know how, read this helpful step by step guide.

Angular

A topic that is likely to draw a lot of attention is AngularJS (one of my favourite frameworks). This September saw the release of version 2.0, which is completely different from the Angular 1.x releases, as Patrick Schmidt explained in his session.

One of the first differences is that Angular 2 is written in TypeScript. This release also supports writing your app’s code in TypeScript, although it is still possible to use JavaScript or Dart. An advantage of using TypeScript, however, is that this prevents you from creating bugs due to type mismatches: these show up in compile time rather than in run time.

Another major difference is the assembly of the Angular core. Rather than being a single – quite large – JavaScript file, it now consists of dozens of smaller files. This helps keep the Angular’s base package small, because it only includes those functions that you need to run your app. To reduce the number of resulting HTTP requests, you will need to find a way to bundle these separate files into a few packages. Maurice de Beijer mentioned Webpack and JSPM as tools you might consider for this task. The key framework that ‘glues’ all these separate files/functions together is SystemJS (together with RequireJS) but you could also use Webpack if you like. It may take a little while to set up your configuration, but once it’s done, you’re good to go.

Angular2 is much faster than Angular 1.x because of how the components operate and the more efficient solution for binding data. What’s more, Angular 2 supports features like ‘lazy loading’ and ‘Ahead of Time Compilation’, which speeds up page loading.

There is an abundance of open-source tools for code analysis, package management, bundling and many other tasks. In his session, Maurice de Beijer gave a great overview of the most popular tools and frameworks, organising these by the type of task they perform, such as task runners or online editors.

To find out more about the frameworks and tools he mentioned, I recommend you take a look at the recording of his session on channel 9 (see below). I will just mention a few good ones, like Chai, which is used to improve your unit test assertions. So, instead of writing:

expect(tea.flavors).toBeDefined();
expect(tea.flavors.length).toEqual(3);

you can write:

expect(tea).to.have.property(‘flavors’).with.length(3);

In addition to expectations, Chai also supports other styles for determining test results, such as ‘assert’ and ‘should’.

For performance testing, Chrome provides some very nice dev tools, but you can also use WebPageTest. And for sharing or demonstrating JavaScript code samples, you may already know jsFiddle, but how about JSBin or HyperDev? Joel Spolsky has published an article about HyperDev on his site, where he shows how fast you can get a web app up and running (for demonstration or prototyping purposes, for example) using HyperDev.

Many tools are available for every need, so the choice is yours!

Any set of actions you would like to run can be scripted using Gulp in the form of gulp tasks. In the Task Runner Explorer in Visual Studio, you can bind gulp tasks to one of four Visual Studio actions: ’Project Open’, ’Before Build’, ’After Build’ and ’Clean’ (clean solution). The Task Runner Explorer is available as the NPM task runner extension or as part of the Microsoft ASP.NET and Web Tools extension.

This makes it possible to clean up old files (*.css / *.min.css / *.js.map / *.js / *.min.js), transpile your LESS and TypeScript files, minify the resulting files, bundle them, start a Karma test run using PhantomJS and generate a Chai assert test report – all by starting the build of your solution (in Visual Studio)? In my view, this is the ultimate proof that Microsoft has opened its arms to the open-source community!

Sessions

The recordings of the sessions about open-source software are available on Channel9:
• Jeff Burtoft: State of the Union - Client technologies
• Patrick Schmidt: Introduction to Angular2
• Maurice de Beijer: Tooling for the productive front end developer

Part 1 of this blog
Microservices, a small step or a giant leap?