How to Host your Static Website on GitHub Using your Custom Domain Name
Beatrice Wambui Mbugua
Front-End Developer | React & TypeScript Expert | UI/UX | Building Scalable User-Centric Products
Recently, I created my static portfolio website. At first, I was conflicted on where to host it regardless of Github providing the generic option of hosting it using the github.io option. After purchasing the domain name, I wanted a hosting provider that was not expensive or complicated. During my research, I stumbled upon hosting your static website using Github, but now with a domain name.
Where to start?
First, you need to push your code to Github using the git process. Second, you need to publish the gh-pages. Afterwards, you will need to follow specific steps and they are as easy as ABCD.
2. This is how your pages will look like. Remember this is enabled by the gh-pages. Your site will have been published at github.io, the default domain. Therefore, you will add your custom domain in the under the custom domain option. However, you will notice the HTTPS will not be enforced.
3. Head to your Domain provider and add the CNAME record. The CNAME record redirects the github.io to your custom domain. For instance, if your want your site name to be www.example.com, create a CNAME record that points www.example.com to <user>.github.io.
4. To enforce the HTTPS, select?Enforce HTTPS. It can take up to 24 hours before this option is available.
5. Once that is set, redirect your website to point to the Github IP Addresses. Therefore for this, add the Alias as shown above through feeding the following IP address.
领英推荐
To create?A?records, point your apex domain to the IP addresses for GitHub Pages
185.199.108.153
185.199.109.153
185.199.110.153
185.199.111.153.
6. To confirm whether your DNS record configured correctly, use the?dig?command, replacing?EXAMPLE.COM?with your apex domain. Confirm that the results match the IP addresses for GitHub Pages above.
For?A?records
$ dig EXAMPLE.COM +noall +answer -t A
> EXAMPLE.COM 3600 IN A 185.199.108.153
> EXAMPLE.COM 3600 IN A 185.199.109.153
> EXAMPLE.COM 3600 IN A 185.199.110.153
> EXAMPLE.COM 3600 IN A 185.199.111.153.
7. In the end, your pages setting in Github will be looking as such:
8. And you can launch you website having hosted on Github for free.
The hosting is absolutely free and the process takes less than 10 minutes while following the right instructions. All the best.
Blockchain Engineer
3 年Short and easy to follow good work