Day063 — How to deploy to GitHub Pages
I deployed my personal website on GitHub Pages (jacky-ttt.github.io) and direct it to my domain (TsangSzeChun.com). There are tons of articles that teach you how to do it.
I use Gatsby for my personal website because I know React. Gatsby simplifies lots of configuration that I don’t want to spend time with.
I used this starter kit.
Things to be aware of
Since the gh-pages -d public -b master command will remove all content in master branch and copy the files generated by Gatsby from /public into the branch, it blindly removes everything, which includes the important CNAME file. The CNAME file is used by the GitHub Pages to indicate which custom domain I want to use. Without it, TsangSzeChun.com cannot be redirected to jacky-ttt.github.io.
To solve it, you just need to move the CNAME file to the static folder, which is on your development branch. Everything you put into the static folder will be copied into the public folder untouched. Then, the public folder will be copied to master branch with the command gh-pages -d public -b master. At the end, the CNAME will appear in the root directory of master branch.
Things to be aware of 2
You must use master branch for the publishing your website for a User / Organization pages, which is my case. It will show “User pages must be built from the master branch.” in the setting page of my repo. Therefore, my branch set up is master branch purely for publishing and dev for development. After I have done my development on dev branch, I will run gh-pages -d public -b master to push to master branch. I do not commit and push manually on master branch.
TODO:
- change favicon
- customize the floating svg images in the background
- fix the long project section: it looks like it has 3 sections, and my projection section lays between the 2nd and 3rd section.
