index.html at the root of our app that handles all the routes. So we need to tell our hosting provider (in this case Netlify), to redirect any other requests back to this
Add a Redirects File
Create a file called
_redirects in the
public/ directory of your React app with the following.
/* /index.html 200
This is basically saying that any requests should be sent to the
index.html of our React app.
Note that this file doesn’t have an extension. It is just called
Let’s commit these changes and push to GitHub.
$ git add . $ git commit -m "Adding a redirects file" $ git push
And we are now ready to host our app on Netlify!
Create a Netlify Account
Start by creating a free account.
Next, create a new site by hitting the New site from Git button.
Pick GitHub as your provider.
Then pick your project from the list.
The default settings are exactly what we want for our React app. Hit Deploy site.
This should be deploying our app. Once it is done, click on the deployment.
And you should see your app in action!
Just like that, our app is live! You can share it with your friends and the rest of the world!
By default, a site hosted on Netlify uses their domains. But we want to host our notes app on our own domain. To do that, let’s first purchase a domain name. We’ll be using AWS to do so because we’ll be using this same domain later for our Serverless API.