Serving Client from Our Backend

[00:00 - 04:45] Welcome back in this lesson. We are going to configure our react app to run from our server We'll start this by telling our API server That it needs to host react files. So let's close this and open program dot cs file Now between app dot use routing and app dot use course. They will write app Dot use default files. So let me write app dot use default files This will go to the www root folder and look for index dot html file Which is an entry point for all our react projects All the css javascript and the media will be served from this static folder And as you can see It has minified version of all our code To use them, they will create another middleware which will be app dot use static files Now below app dot map controllers, we need to create another middleware which will be app dot map fallback to controller And the first one will be the file which is index And the second one will be the name of the controller which is 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 right now Now let's start working on the fallback controller So that it can serve the index dot html file So all the routes which are not /api/courses/api categories will be served by this fallback controller Now inside controllers, let's create a new class and let's call it fallback controller This controller will not derive from the base controller like other controllers do This will derive from simply controller This controller is now basically deriving from the view which will be responsible for serving index dot html file And we can also mention a law anonymous on top We are using this because we want to return it to the anonymous users. So let's import it using Microsoft ASP net core authorization Now let's create the public method Which will be returning i action result And this will be called index Now this will return physical file It will take two parameters. The first one will be the path. So let's write path dot combine And here we need the current directory. So for that I will need directory dot get current directory dot Let's import path using system.io Now after the current directory we need the folder which is www root And the file which is index dot html The second parameter will be the type of file which is text /html With this configuration in place, we will be able to serve the react code from our server. Let's open the terminal Let's shut the server and run it again Now let's open the browser and instead of opening localhost 3000, they will open localhost 5000 As you can see our application is working as expected. The courses page is working fine The description page is working fine as well But this time it is much faster because our code is now minified Amazing. So our code is working as expected And our built production code is being served from the api server