How to host your React App on Github

There are a lot of hosting platforms where you can host your React application, with some of them being Vercel and Netlify. But did you know that we can also host our React Application on Github which is a super easy process. So let's go and host your React application on Github.

Step 1:

Create a GitHub repository and copy the HTTPS URL which is your remote repository URL

Step 2:

Connect your local repository with the remote repository and push your code to the remote repository after committing the changes

git remote add origin [ Your Remote Repo link ]
git add -A 
git commit -m "Commit Message"
git push -u origin main

Step 3:

Go at the top of the package.json file that is present in your react app add the homepage key with the value "https://[ Your github username ].github.io/[ Your Repo Name ]"

"homepage":"https://[ Your github username ].github.io/[ Your Repo Name ]",

Step 4:

Go to the terminal and install gh-pages through npm and save it as a developer dependency

npm install gh-pages --save-dev

Step 5:

Go to the package.json file and inside the scripts object you will have to add two more scripts i.e predeploy and deploy

"predeploy":"npm run build",
"deploy": "gh-pages -d build",

Step 6:

Now just run "npm run deploy" in your terminal and after few seconds your app is hosted at the "homepage" URL that you provided in step 3 🎊🎉

🙏 So this was a short guide on how you can host your React application on Github, Thank you for reading. I hope this helped you to host your React Application. If you want to connect with me my inbox (Twitter) is always open 🙌.

Harsh Singh