Github pages still shows README after deploying React app

Question

I have a create-react-app project (https://github.com/khpeek/beomaps/tree/master) which I'd like to deploy to Github pages using gh-pages. Following this tutorial, https://medium.com/@serverlessguru/deploy-reactjs-app-with-s3-static-hosting-f640cb49d7e6, I've added the following to my package.json:

However, if I run npm run deploy, it is published,

but the Github page, https://khpeek.github.io/beomaps/, still shows default content based on the README.md. Do I perhaps need to change the deploy directory?

Answer 1

In the Options page of the repository, I had to select the gh-pages branch instead of the master branch:

(I also re-installed gh-pages as a normal dependency, not a development one (i.e. npm install gh-pages --save instead of npm install gh-pages --save-dev), though I'm not sure whether this was important).

Now the page is visible on Github pages:

Answer 2

I think this has to do with github not knowing which branch it should use (master vs main or idk). Changing my deploy script as follows solved the issue for me:
"deploy": "gh-pages -b main -d build"
This tells github pages that it should use branch main.