This week I am going to cover how to host a website using Github Pages. It’s super easy to do and if you also own a domain, it only takes a few extra steps to setup your Github Pages website with it!
Getting Started
To get started, you’ll need the following:
- Github Account
- Website Source Code
- Custom Domain (optional)
Step 1: Create a Github Repo
Using your Github account, you’ll want to login and create a new repo that will contain your website. Feel free to use whatever settings work best for you. I will be using the following:
It should be noted that it does not matter if your repo is public or private.
Step 2: Create Website Source Code
Now that we have our repo, you’ll want to have some kind of content for your website that will be displayed to your visitors. You can use anything for this step to create your content, but for this walkthrough we will just create a basic “Hello World” html file.
To get started, let’s go ahead and clone our empty repository
Inside our repo, let’s add the following file:
If you open up your browser of choice and navigate to this newly created HTML file, you should see the following:
Now let’s push this change up to our Github Repo!
We should now be able to confirm that our file was added by checking the repo on Github.com
Step 3: Setup Github Pages
Looking at our repo on Github.com, let’s navigate over to our Github Pages settings:
In this case, we’ll want to use the following settings:
After you click save, you should see something like the following after your page refreshes
We should now be able to use that link to navigate to our Index.html. Make sure you append the filename to the end of the provided URL so that you’re able to view your website. In this case, I will be visiting https://d3ism3.github.io/SampleWebsite/Index.html.
And just like that, our website is now published and publicly available for the world to see!
(Optional) Step 4: Setting Up Custom Domain
If you own a domain, you can setup your Github Pages website to use that instead of the one Github generates for you. In my case, I own my comains through Google Domains. I will be providing a TLDR summary for setting up your custom domain, but if you want more information Github provides useful documentation here.
For this example, I own the domain d3isme.com. So I setup the following record in my Google Domains setting:
Once you have this record properly created, you will now need to revisit your Github Pages settings and add your Custom domain. For this, I will display the settings that I have for a separate repo:
Once your custom domain is properly setup, you should see a message from Github mentioning that your site is published like above. This setting may take some time to fully take affect after you added your custom record to your domain.
Conclusion
Overall, hosting a website with Github Pages is super easy and convenient! Once you’ve done it at least once, it should take you about 5 minutes to do it the next time!
If you enjoyed this post, maybe you’ll enjoy some of my other posts:
- Remote Controlled Finch Robot
- Creating a Python Bot with Selenium
- Hack The Box: Impossible Password
- How to send text messages with Python for FREE
- Asynchronous Server/Client with Python
I post something new every single week on Sunday! If you want to help out by supporting me, you can also follow me on WordPress, Instagram, Facebook, Twitter, and/or Medium! All of my accounts are linked on the icons below.
As always, if you liked what you read and you’d like to support me, please consider buying me some coffee! Every cup of coffee sent my way helps me stay awake after my full-time job so that I can produce more high quality blog posts! Any and all support would be greatly appreciated!
Testing On Prod 
4 thoughts on “Hosting a Website with Github Pages for Free”