Simple chat with React.js and ASP.NET Core SignalR

Published Dec 09, 2017Last updated Mar 19, 2018

Introduction

In one of the last posts, we saw how we can make a simple chat with ASP.NET Core SignalR and Angular 5. This time, we will use the same code from the backend and swap Angular with React on the frontend.

There is also a post about making a simple SignalR app with pure ASP.NET Core stack, using Razor Pages with vanilla JavaScript on the client - ASP.NET Core SignalR simple chat.

The code on the backend will be the same, and because of that, we will focus on the client side.

react-create-app

We will use create-react-app, which is an officially supported way to create SPA applications with React. It has no configuration, but it does use Webpack and Babel under the hood.

It is easy to use and requires no configuration, to be precise, you can't configure it. It comes with 4 predefined scripts:

start - starts the app in development mode

test - starts test runner in interactive watch mode

build - builds the app for production, outputs to build folder

eject - as an output, you get your app files + configuration files (babel, webpack, environment, paths etc.). You can't go back once you eject an app, you lose the ability to use the _no-configuration _create-react-app tool. However, you can customise and configure everything as you prefer.