This video is available to students only

Serving Client from Our Backend

In this lesson, we're going to see how to serve client app from our backend

Serving client from our backend#

In this lesson, we are going to configure our react app to run from our server. We will start this by telling our API server that it needs to host react files. We will go to our program class and between app useRouting and app UseCors, we will write app.UseDefaultFiles. This will go to the wwwroot folder and look for index.html file which is an entry point for all our react projects. All the CSS, JavaScript and the media will be served from static folder. As you can see, it has the minified version of all our files. To use them, we will write app.UseStaticFiles below this.

We need to add another middleware which is app.MapFallbackToController("Index", "Fallback"). This is for a scenario when our API doesn't understand a route. Here, index is the action and fallback is the controller which we are going to create now. We are going to create a fallback controller so that it can serve the index.html file. So all the routes which are not slash api courses or slash api categories will be served by this controller.

Now inside controllers, let's create a new class with the same name, fallbackController. This controller will not derive from the base controller like other controllers do; this will derive from Controller. This controller is now basically deriving from the view which will be responsible for serving index.html file. We can also mention AllowAnonymous on top because we want to return it to the anonymous users.

Start a new discussion. All notification go to the author.