Skip to main content

React App on GitHub Pages

Loading...

Recently I came across the idea of publishing a React App on GitHub Pages. I can distribute my React App using GitHub, further saving server bandwidth and simplifying the API server structure. I have created a boilerplate for this structure.

Key points

  • GitHub has a feature that automatically posts the docs folder into a small landing page.
  • Create-React-App builds its results into a build folder.
  • So if I can automatically move files from /build to /docs whenever I build the app, it would work as if I have set up a CI/CD structure.

Implementation

"scripts": {
"start": "react-scripts start",
"build": "react-scripts build && rm -rf docs && mv build docs",
"test": "react-scripts test --verbose",
"eject": "react-scripts eject"
},

The yarn build command will replace the docs folder with a newer build of the app.

Result