Free Website Hosting Using Github Pages – Add Custom Domain – Github Pages Tutorial

Blog Post: https://codelikeadev.com/blog/host-static-webste-on-github-pages

In this video, we will learn how to host a static website for free using Github Pages.

We will also add our own custom domain to the website free of cost as well.

We will use Github pages to host our website to the internet.

Github is a software hosting platform and offers version control using GIT.

Recently it has introduced a new feature where
users who already host their codebase with
Github can now host a static website for free.

So GitHub pages can only host static websites! what does that mean!

A Static website is a website that is made of 3 components
HTML files, CSS files and JAVASCRIPT files.
These comprise together to produce beautiful web pages
which we can see on our browsers.

Github pages will not be able to host dynamic websites.
that is websites that are based on a backend technology
example, C#, and .NET, JAVA, PHP, RUBY, etc.

Now that we’ve understood what we can host, let’s jump on to how we do it.

For this tutorial, I will host a portfolio website of a developer
like myself onto the internet

I created this beautiful responsive static website using
HTML, CSS, and JAVASCRIPT and you can find the detailed youtube tutorial
https://www.youtube.com/watch?v=-_ubESj5vaI

We will start by adding our website code to a GITHUB repository.

For that Let’s create a GITHUB account.
In your browser, browse to https://github.com/

And then go to the Signup link on the top and create an account for yourself.

If you have an account /Once you have signed up for an account,
Please click on the Sign In link and login to GITHUB

Now it’s time to install GIT on your computer
as GITHUB uses GIT which is an open source version control software

You might have GIT installed,
so let’s check that first,

Open a command prompt window (Windows + R) then cmd

type
git –version

If it comes up with
– ‘git’ is not recognized as an internal or external command

that means git is not installed on your system.
If it comes with a version number, skip the installation part
and jump onto the configure git section of the video.

To Install Git,
I will go to my browser and visit
https://git-scm.com/downloads

Configure GIT
git config –global user.name “your_username”
git config –global user.email “[email protected]”

It’s now time to create a new repository on GITHUB

After you have logged on to the Github website,
we will click on the ‘New” button

Now enter the repository name,
for this example, I will give it “name”

After creating the repository we will clone our repo to the local computer using
git clone “copied https url”

This will create a new folder. Copy the files for the static website inside this new git folder.

Then do the following
git add .
git commit “message”
git push

Authenticate using the browser and refresh the page to see that the files are now in Github.

Now go to the Settings tab and under pages, use “Master” repository and root folder to publish the files.

Then browse the website using the Github URL.

Now you can add a custom domain in the box on the same page.
You would have to add an ALIAS record in your registrar from where you bought the domain.

#GithubPages #WebsiteHosting #FreeWebsiteHosting