Sunday, December 11, 2016

Gentle Introduction to ASP.NET Template Pack (with Angular 2)



I was looking into ASP.NET Core since its inception and here I got a chance to write a small post on a Visual Studio Template Pack. ASP.NET core was released in last year as a complete rewrite of .NET framework 4.6 and comes with a new architecture based on .NET Core. Furthermore, Microsoft highlights that “it was architected to provide an optimized development framework for apps that are deployed to the cloud or run on premises”.

Unlike in good old days, I pay attention to a good starting point when I’m building a new application. In that sense, I prefer my tools to be configured in a way that I don’t have to rebuild my client application and publish all changes made to TypeScript and CSS files without interrupting reloading pages. Also, when building the application, it would be nice to have separate builds for development and production. Where production builds can be as minimal as possible to include only what it needs, whereas development builds may contain necessary source maps to aid debugging. Finally, I found ASP.NET Core Template Pack after having a quick search in Visual Studio Marketplace, which satisfies above requirements as a preconfigured starting point. 

I remember the time Grunt was introduced to me, and Webpack is the 2016 version of Grunt. I need a build setup before I run my application since it is mostly written in TypeScript. Therefore, Webpack is responsible for compilation, building and minification. This template is relying on Webpack Dev Middleware usage; hence it is easy to continue changes or modifications to the code already compiled and even to view them in seconds. In this case Webpack compiler remains active in memory and serves incremental compilations to new modification. This also enables the hot module replacement.
Overall my experience with ASP.NET Core Template Pack has been good and I really recommend this as a starting point for ASP.NET projects that uses Angular 2 in frontend. Happy coding 😊