How to Host Websites on GitHub for Free

Most of us (especially programmers) always use GitHub to store and share codes with co-developers, as GitHub makes it easier to manage projects. Apart from storing codes, we can use GitHub to host our portfolio websites or simple static blog for completely free. Sounds cool right? In this article, I am going to share how to host websites on GitHub for free.

So let’s dive in.

How to Host Websites on GitHub

Based on the operating system, setup is slightly different. I am explaining one by one.

Prerequisites

• GitHub account
• GitHub Desktop App (for windows and Mac users)

Step 1: Create a GitHub Account

I am sure, as a programmer you already have a GitHub account. If not, create a GitHub Account first.

Step 2: Create Repository on GitHub

Login to GitHub account and create a repository. Use your GitHub username in the repository name. For example

[username].github.io

Replace [username] with your GitHub username.

Make sure, your project should contain your GitHub username. It is very important, it tells GitHub that you’re making a webpage. As my username is “shivam5th”, my project(repository) name will be

shivam5th.github.io

After creating the repository, clone your repository to your computer. To clone the repository first, go to the repository and click on Code. On clicking code a dropdown will appear, now click on SSH and copy the git repository cloning link on the clipboard.

Step 3: Create a Directory and Initialize GIT on Computer

Now, on your system(computer) create a directory and initialise GIT empty repository. Open terminal and run following commands.

$ mkdir MyWebsite

If GIT is not installed on your system, you can install GIT using the following guide. Now create an empty GIT repository by the below command.

$ git init

After GIT initialisation, clone the repository from the GitHub as explained on 2nd step.

$ git clone [email protected]:shivam5th/shivam5th.github.io.git

It will clone the repository to your machine. It will ask your user id and password during cloning, if you haven’t authorised SSH by adding your system public key to your GitHub account already.

Once cloning completed, replace the files with your static website files on the cloned directory. After replacing the website files, push the repository to GitHub again by below commands.

$ git add .
$ git commit -m “update website files”
$ git push

After the GIT push is completed, go to the browser and paste your GitHub hosted website URL.

https://shivam5th.github.io

Your website should open now.

Host Websites on GitHub (Windows & Mac)

Now, if you are a windows or mac user, you can download the GitHub desktop application on your machine. The application is cross platform and pretty user friendly. You can easily download the application from the GitHub Desktop portal.

For both windows and mac users step 1 will be the same. Now clone the repository from GitHub using the GitHub desktop application.

Step 4: Launch the GitHub Desktop Application

Launch the GitHub application, first click on File and then Clone Repository. As you already logged in to the GitHub desktop application, you can select your repository from the list.

When you click on Clone repository, a new window will open with all the existing repositories on GitHub. Now choose the correct repository to clone.

Once cloning completed, you can replace the website files on the cloned directory on your computer and commit the changes.

As soon as the commit completed, now click on Push Origin to update the remote GitHub directory.

When Push completed, check the website on the browser, if the changes are updated.

https://shivam5th.github.io

Conclusion

You have successfully learned how to host websites on Github for free. If you have any doubts feel free to contact me, I will definitely try to help you. Also, you can join our elite Facebook group to get direct help from me. If you like this tutorial, please share this article on your social media handle.