Adding a .NET Core back-end to an Aurelia project

Question

I have my front end in Aurelia and I'm trying to add a .NET Core back-end. My back-end is supposed to send some data to the front-end and also receive data that's submitted from the front-end. I tried the following:

mkdir app
cd app
dotnet new webapi
au new --here

This works fine but the back-end is listening on port 5000 and my front-end is listening on port 8080. Is this the right way to add a .NET Core back-end and is it good practice to have both your front and back-end running on different ports?

Answer 1

Is this the right way to add a .NET Core back-end

If you would like to add a new ASP.NET Core project for Aurelia, there's no need to invent your own workflow. You don't have to create your ASP.NET Core project.

Simply use au new( without dotnet new webapi ) :

    PS aurelia-app-hello> au new helloworld --here
    No Aurelia project found.
                          _ _          ____ _     ___
      __ _ _   _ _ __ ___| (_) __ _   / ___| |   |_ _|
     / _` | | | | '__/ _ \ | |/ _` | | |   | |    | |
    | (_| | |_| | | |  __/ | | (_| | | |___| |___ | |
     \__,_|\__,_|_|  \___|_|_|\__,_|  \____|_____|___|


    Which module loader / bundler would you like to use?

    1. Webpack (Default)
       A powerful and popular bundler for JavaScript
    2. CLI's built-in bundler with RequireJS
       RequireJS is a mature and stable module loader for JavaScript.
    3. CLI's built-in bundler with SystemJS
       SystemJS is Dynamic ES module loader, the most versatile module loader for JavaScript

    [Webpack]>

    What platform are you targeting?

    1. Web (Default)
       The default web platform setup.
    2. ASP.NET Core
       A powerful, patterns-based way to build dynamic websites with .NET.

    [Web]> 2

Choose the 2nd option, and the au-cli will create a ASP.NET Core project for you. It will also setup all the configurations automatically.

is it good practice to have both your front and back-end running on different ports?

Don't worry. You're in the right direction. If you look into the source code of SPA by ASP.NET Core team, you'll find out that they are also doing the same thing as you. When there's an incoming related message, the ASP.NET Core server will simply proxy it to dev server.

For example, the default project template for creating ASP.NET Core application with Angular uses the angular-cli to start front end dev server on a port, which is different from the one listened by ASP.NET Core.

As a side note, the "front end" project only runs when in development. There's no need to care about the performance.