How to Setup GitHub Pages with React

Prerequisite

  • Having NodeJS installed. The main component is actually the “npm”. The version I am using is 14.16.1
  • Having git installed
  • Having a GitHub account

Create a GitHub repo for your page

just an example, normally should be your username

Setup the React on Local Machine and Push to GitHub

# cd to the place/directory you want to save the code first
cd c:\Repo
# install create-react-app globally
npm install -g create-react-app
# create a brand new react project, you need to use npx for creating the project
npx create-react-app hopuichung.github.io
# go into the created folder
cd hopuichung.github.io
# install gh-pages package
npm install gh-pages --save-dev
  • add homepage for your GitHub page URL. In my case, it is https://hopuichung.github.io/
  • add "predeploy": "npm run build" and "deploy": "gh-pages -d build" to the scripts section
git add .
git commit -m "Create react app"
git push origin master

Build and Deploy the app

npm run deploy

Finally…

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store