Deploy Your React App Using Netlify
Really easy and its completely free

I'm a full stack developer based in Australia. I write articles about Node.js, React, JavaScript & Web Development to make your learning journey easier ๐
Search for a command to run...
Really easy and its completely free

I'm a full stack developer based in Australia. I write articles about Node.js, React, JavaScript & Web Development to make your learning journey easier ๐
No comments yet. Be the first to comment.
Introduction Website performance is an important aspect of web development. It consists of mainly two things: The speed of your website How usable is your website for visitors? Importance of website performance Website performance is very importa...

There are plenty of native web APIs that have a variety of uses. Here are 5 useful APIs that I use quite often in my web development projects. Clipboard API The clipboard API is a simple method to copy text to a user's clipboard. This can be used in ...

Hey All ๐ In this article, we'll be covering the Fetch API in JavaScript how you can use it to make HTTP requests. What is the Fetch API? The fetch() method provides a simple way to make HTTP requests in JavaScript. It is natively in the browser, me...

Hey All ๐ In this article, we'll be covering 4 mistakes commonly made by people while learning to code that will seriously impact their coding journey. #1 - Copying and Pasting The first mistake I'll talk about is copying and pasting. We've all don...

Introduction There are plenty of units in CSS. From px to vh, there is an abundance of units all with their distinctive use cases. Considering the amount of options, its perfectly reasonably to be confused as to which unit you should use and where. T...

๐ Hey All,
Today I'm going to show you how to deploy a react application with a service called Netlify. This method is completely free and allows you to automatically publish your web app by committing to your GitHub repo.
Lets get started!
Firstly, head over to Netlify's website and create a free account following their directions.

Image: Netlify's sign up page
Click on the Import from Git button under the "sites" heading on the overview page:

Then, connect to GitHub by clicking on the "GitHub" option:

Pick the project repository you wish to deploy:

Before clicking deploy, make sure that your settings are correct under the Basic build settings header:

Make sure the build command is set to yarn build or npm build.
Make sure the publish directory is set to build.
I believe Netlify automatically detects a React app and configures these settings for you but check to be safe ๐
Click on the Deploy Site button and your react app will start building and then be deployed.

The site will be deployed on a weird domain name ending with .netlify.app. You can change the site name in site settings which will also adjust the domain for you.
By deploying your react app on Netlify, you:
Get automatic deploys from your GitHub repo
Get a free SSL certificate that is automatically setup
Can connect your custom domain to your application (topic for another article)
Get access to cool features like forms (for handling form submissions), identity (authentication), analytics (paid unfortunately) and many more ๐
In this article, you've learned how to deploy your React application to Netlify for free.

๐ Thanks for reading this article!
If you like what I do and would love to see more related content, follow me on my other social platforms:
GitHub: Blake-K-Yeboah
LinkedIn: Blake Yeboah
Twitter: Blake Yeboah
You can also show your support by buying me a coffee ๐