How to Create a Free Personal Website using Github

Kiri Um
6 min readSep 4, 2020

Searching for a job can be a really frustrating experience. Before you even get a chance to interview with a company, you need to find a way to separate yourself from the rest of the crowd and get noticed by potential employers. One way to stand out from other candidates while you’re on the job hunt is by having a personal website that highlights your skills and what you can bring to the company.

A personal website is a place where you can showcase your professional portfolio, blog posts, resume and interests. It also gives you an opportunity to be more creative in presenting yourself than a traditional resume. I’m not saying that you shouldn’t take time to create a great resume, but a personal website is just another weapon to help you in the battle of landing your dream job.

In this tutorial, I’m going to do a walkthrough on creating a free personal website using Github. Github is a hosting platform for software version control and collaboration that allows people to work on projects together from anywhere. Github also allows users to create and host a single static personal website for free.

To get started, log in or create an account at https://www.github.com.

After you have logged in to your github account, navigate to “Repositories” and click on “New” to create a new repository.

On the page that pops up, fill out the Repository name with:

[your_username].github.io

Once you have filled out the repository name with your correct username info, click on“Create repository”. This is going to create a location at github where all of the data used to load your website is going to be stored.

If you are comfortable with adding data to a local folder and pushing data to github using the terminal, you can skip this next section.

For this example, we are going we are going to use the Github Desktop app to push our website data from our local machine up to the github website. Go ahead and download and then install the app, if you don’t have it already. Next, open up the app and log in with your github username and password.

Once you log in, you should see a similar screen to this, showing the repository you created earlier on the website:

Next, select the repository named [yourusername].github.io and then click on the button located below that list to clone the repository. A window will then pop up and here you will need to fill out the local path with the location on your computer where you want to create a new folder called “[yourusername].github.io” to store your website data and link it to github. Once you enter that information, click on th “Clone” button.

This should be the next window that pops up, showing your empty repository:

Next, using you file browser, navigate to the new folder you created. This is where you are going to put your files needed to render your website. For demonstration purposes, we just downloaded a free website template and pasted the contents into the folder.

Next, go back to the Github Desktop app, navigate to your repository and you should see something similar to the image below. It should display all of the files that you added to the local repository folder. Once you have confirmed that your files are there, fill out the required “Summary” field and the optional description field. Next click on “commit to master.”

Now, if you go and check out your repository on github.com’s website, you should be able to all of your files that have been pushed to Github.

Next go to https://[your_username].github.io and your website should be alive!

Now, here is where you would go back into the html code in your repository and start changing out the code in the template and filling it out with your own personal data.

Linking a Custom Domain Name to Your Personal Website

So right now, to navigate to your website, you need to go to go to a domain name that looks like:

https://[your_username].github.io

To make your website a little more memorable to visitors, we can create a custom domain name that directs them to your website. You also need to keep in mind that employers will look you up online before contacting you, so owning the search results with your unique domain name can be an advantage.

Purchasing a domain name does cost some money, and was I able to purchase mine with my name on it for only $12 a year.

To purchase a domain name, we used Google Domains because I own other existing names through them and I wanted to keep things simple. So, go to https://domains.google and search different domain names until you find one available that you want to use for your website.

After you have purchased your domain name, go back to the Github website and visit your repository. Then click on settings, scroll down and fill out the text field called “Custom Domain” with your newly purchased domain name.

Next, return to google domains and go to navigate to your newly purchased domain .

Go to the sidebar and click on the DNS management option.

Scroll down to Custom Resource Records and and add a CNAME record with the following parameters:

type = CNAME

name = www

TTL = 1 hour

value = [your_username].github.io

Adding this record tells the DNS to point your domain name requests towards your site hosted at [your_username].github.io.

Next add another record with these parameters:

type = A

name = @

TTL = 1 hour

value = 185.199.108.153

Adding this record tells the DNS to connect your domain name with the Github server’s IP address that hosts your website.

If that is giving you problems you can also try using these alternate IP addresses:

185.199.109.153

185.199.110.153

185.199.111.153

If you have questions about the current live IP addresses you can look here.

This is how current list looks like after adding the new records:

Now it’s live! If you go visit your domain name using your browser it should display your personal Github website.

--

--

Kiri Um

Aspiring Software Engineer, Geologist and Geophysicist