In this guide, you’ll learn how to easily deploy react app to Github pages — a free and reliable way to host your frontend projects. We’ll walk through installing the gh-pages package, configuring your package.json, and pushing your build to GitHub so your app is live and shareable with just one command. Perfect for portfolios, demos, or personal projects!
Deploy React App to GitHub Pages
1. Add homepage
Open your package.json file present inside your react app and add homepage property.
"homepage":"https://yourusername.github.io/repository-name"replace the above url with your github username and repository name.
2. Install gh-pages
Next, we need to install a package called gh-pages.
npm install --save-dev gh-pages3. Deploy script
It’s time to add a deploy script commands in our package.json file.
"scripts":{
"predeploy": "npm run build",
"deploy": "gh-pages -d build",
}Now in your terminal run npm run deploy
4. Setup source to gh-pages branch.
Once you successfully deployed open your GitHub code repository and click on settings tab if you scroll down you can see a GitHub Pages then choose a branch to gh-pages.
Deploying a React app to GitHub Pages is fast, easy, and perfect for portfolios, demos, and simple projects. Now that your app is live, you can share it anywhere, and even automate future deployments using GitHub Actions. To learn more about React Development, follow Our Blog
