In your developer journey you may come across a situation where you want to host a website/SPA for free. Well, nowadays there's more than one way you can do it. The basic and simple is to use Netlify or Vercel like service. You just need to create account on either of service and connect your GitHub or GitLab or upload zip of your code to create a site. If you choose GitHub or GitLab, you may need to authenticate this service to the platform and allow desired repository to be accessed. Once the site is created it will be hosted on their free domain which you can directly access. PS: you can connect your own domain to it too for free.
For this post we'll talk about how we can host a static html page using only GitHub, Pages.
To use GitHub Pages, you need to enable it from the repository settings.
First, you'll need to create a github repository with this exact name: <your github usernmae>.github.io
Add your static site code in the repository.
Now, go to Settings -> Page (from the sidebar), you'll get a screen like this:
From the highlighted dropdown, select the branch from which you want to host and hit Save. And boom it will be live shortly on <your github username>.github.io
Here also if you want to host it on your own domain you can add a Custom domain on the same page. After that you need to add CNAME file in root of your repository and add just a custom domain there. Go to your domain registrar and add a CNAME entry for the domain/subdomain and add repository name in the value field. If you're using a subdomain, you must first add a subdomain in DNS settings. Domain registrar takes 24 hours to add CNAME to their system. You can see your project hosted on your domain after that.
Okay, you might be confused that what if you need to host another static site? For that you can create another repository (any name) and follow the similar settings. If you don't provide a custom domain here, it'll be live on <your github username>.github.io/<repository name> or <main custom domain>/<repository name>
Tip: Have your basic portfolio page in your this repo. <your github username>.github.io
Nowadays, in the world of SPA built using React, it's bit complicated in beginning to host but Netlify and Vercel make it so simple. Though, you can similarly host your React code in GitHub Pages too, but you need to write GitHub Action script to generate build and store the build files to a separate branch.