Sign in Subscribe

AngularJS + ASP.NET Core 1.1

Martin Bulant

• 1 min read

UPDATE:
Yeoman is deprecated for Core 2.0. See npm page. It should be used dotnet new instead.

To install all other frameworks use
dotnet new --install Microsoft.AspNetCore.SpaTemplates::*

DEPRECATED:

A list of steps for a new project and running from a command line:

1) npm install -g yo generator-aspnetcore-spa - download to global repository a template generator, -g means global, usually it is a directory somewhere on your pc, ie for Windows it is {drive letter}/Users/{username}/AppData/Roaming/npm/node_modules)

2) mkdir {your directory} - create a directory for the project

3) cd {your directory}- open your directory

4) yo aspnetcore-spa - it´s a SPA (Single Page) generator from Microsoft team (Steve Sanderson) - several SPA libraries/frameworks can be selected:

  • Angular
  • Aurelia
  • Knockout
  • React
  • React with Redux
  • Vue (pronounced /Vju:/)

5) dotnet restore - restore dependencies of the project

6) set ASPNETCORE_ENVIRONMENT=Development - if the project is run in Visual Studio 2017 then HRM works ok but if it is run from command line aspnetcore environment should be set. Otherwise the changes made in VS Code are not visible if just saved.

7) dotnet run - start Kestrel server on localhost:5000

  • webpack --config webpack.config.vendor.js- sometimes you might need to rebuild vendor.js file. But this is quite rare.

If we load the page in Chrome and hit F12 and open tab Network we will be surprised. A file vendor.js has 3.0 MB! That´s too much. Imagine someone with a 1Mbit DSL line or cell phone carrier under 1Mbit. At best it takes about 15 s to download. That´s not good for the first impression. 3MB is for Angular. Vue.js is somewhere about 600 KB. When Puglished as a Release the size is something about 1MB. Still too big.

A very good resource regarding performance.