Delivering single page applications with ASPNET Core

The .NET Core CLI makes it really easy to create a new projects with .NET Core. By running dotnet new react you get a basic .NET Core MVC app setup to serve and build a React app using Create React App. This is great, and I believe is the best way to create a new React project with .NET, however as of .NET Core 5 the template outputs an out-of-date version of a basic ReactJS app created with Create React App. This article is a step by step guide to how to still use this template but have the latest version of Create React App's output in your project.

Pre-requisites

You will need to have the following installed:

Creating a new project - Step by step

Let's get straight to it with a step by step guide to creating a new ReactJS project with the .NET Core CLI.

Open the command line and run the following to create the base project:

Note: replace MyNewProject with the name of your new project
```
dotnet new react -n MyNewProject
```
Change directory into your new project:
```
cd MyNewProject
```
Run the following to delete the existing ReactJS app that was created:
```
rm -rf ClientApp
```
Optional step: If you want to create a Git repository for the project make sure you do it now since Create React App will create one in it's output folder in the next step if you don't. Run the following
```
git init
```
Run the following to create a brand new React Application (this may take a few minutes):

Note: replace my-new-project with the name of your new project in snake case
```
create-react-app my-new-project
```
Rename the folder that was output to from the snake-case name to ClientApp. For example:
```
rename my-new-project ClientApp
```

That's it! Now you can run the project by opening it in Visual Studio, or Visual Studio Code!

Why is this necessary? A look into the future

This is necessary at the moment because of the way that templating is done in .NET Core 2. The ClientApp folder is checked in to the repository so it doesn't get updated. As described in answer to a Github issue it is explained that Microsoft's aim" is consistency with the SPA frameworks' de-facto standards, not extending them to include other technologies". This is great news but until the new version come out we will just have to keep doing the above.