How To Deploy Static Website For Free?

I want to share my experience on how to deploy a static HTML5 website for free, including a domain name. My write-up is a set of a combination of services like Freenom, GitHub, and HTML5Up. I am sure there are more ways depends on your needs, but if you only need a prototype of a static HTML page, I am about to show how you can spin up your website within one hour for free.

Prerequisites

You need to have an email address, like Gmail, and then you’ve to get two accounts freenom.com and github.com.

“Freenom” is the domain name provider [1]

Github is hosting and software repository provider. It allows to host static and HTML pages [2].

HTML5Up is a beautiful and free template of the HTML5 website under CC license [3]

There more tools to verify your process like:
DNS Checker [4]
GEO Peeker [5]

Deployment

I assume you’ve already signed to Github, Freenom services, and download your favorite template of the HTML5 site.

Now first pic a domain name there a few options with the top-level domain: “tk, ga, ml, cf, gq”

Once you have a domain, go to the service menu, and my domain submenu.
Next to your domain name will see, “manage domain” option.
A new page will see the DNS settings. You will need to choose mange Freenom DNS. In the final step, you will have to create a four DNS records: with a type of A and IP address:

185.199.111.153
185.199.108.153
185.199.110.153
185.199.110.153

You can change TTL from 3600 to 600, for shorter DNS record change.

The next step is to create a brand new repository in Github pages.

Add the github.io domain in it. Like an example below:
mysite.github.io

DNS propagation will take time across all regions. Let’s edit the HTML5Up site. Download the template and unarchive template file on the disk. Open with the favorite editor, and I am using Sublime Text [6]. Open all directory of the website and edit accordingly starting from index.html, maybe need more files also change image files you can make yours, or you can choose from an Unsplash [7].

Once you finished upload to GitHub, there are a couple of ways, the easiest way for the beginning is to drag and drop the whole directory to the repository., It will ask to commit changes to the master branch. Once it’s done. Go to settings on the top right side of the menu of the repository

You have to change a few things:

Go to settings on the top right side of the menu of the repository
You have to change a few things:
From the Source drop-down menu, choose a master branch.
In the CNAME menu, add your custom domain name, which you pick from freenom.
And enforce HTTPS for SSL encryption, save it, and you are ready.

Troubleshooting

Can save a custom domain name of enforcing HTTPS certificate. Could be DNS name didn’t propagate, check with DNS checker [4]. Give more time to this process and come back later.

Using tools like Geopeeker [5] can check if it’s available online in all regions.

Reference

#1 https://www.freenom.com/
#2 https://pages.github.com/
#3 https://html5up.net/
#4 https://dnschecker.org/
#5 https://geopeeker.com/
#6 https://www.sublimetext.com
#7 https://unsplash.com

Kibernetinio saugumo entuziastas; Aktyviausias Lietuvis TryHackMe platformoje; Inovacijų valdymo ir Antreprenerystės Magistrantas @ KTU