Deploy your React app using Netlify

Now that you have built your very first web application using React, it's time to deploy it. I will be using Netlify as it's just simple and straight forward. This blog is for apps that only contain frontend or client side. So before you follow along, please make sure that your app doesn't have a server side or backend.

First, make sure you have the Netlify command line tool. If not, in your terminal run: npm install netlify-cli -g

You may now login to your netlify account using your terminal: netlify login

Next, create a file: netlify.toml in the root directory of your project in the code editor and insert the following:

[build]
    command = "npm run build" 
    publish = "/dist" 

[[redirects]]
    from = "/*" 
    to = "/index.html" 
    status = 200 

If you're unsure about the name of your publish folder, you can check that in your webpack.config.js file.

output: {
    path: path.resolve("dist"), //THIS ONE!!!
    filename: "bundle.js", 
    publicPath: "/",
},

Now, in your terminal use the following commands:
netlify init
You may deploy your app manually or using your git repository. You may name your site (this can be changed later)!
npm run build
netlify deploy
netlify deploy --prod

Your site is now live and ready to go! :)