React Js Tutorial: How to use Github pages root as your personal homepage using gh-pages
GitHub pages is a great place to host your website and lot’s of people use it to host one page apps, you just need to edit, push and changes are live.
While I was working on one of my projects, more specifically my personal homepage built with React, I’ve stumbled upon a problem related with the package gh-pages, used to easily push the code to GH. The issue is that gh-pages by default uses the branch ‘gh-pages’ inside GitHub and if you want to host it on the root of your GitHub personal page, you need to use a branch called ‘master’.
So here’s an example (code partially from the great freecodecamp article on medium):
You create a repository with your username, in my case:
Following freecodecamp’s article, you then need to setup npm to do the deploy using gh-pages, after that, you can easily push the code to GitHub using:
npm run deploy
This runs the pre-defined command:
npm run build&&gh-pages -d build
The solution is to edit the command to:
npm run build&&gh-pages -b master -d build
This will force gh-pages to push the code to the master branch, making it possible to be used on the root of your GitHub page.