How to host a website for free with GitHub Pages

There are many options and prices for web hosting plans. The more expensive plan is capable of hosting large websites but what if a simple hosting solution is needed for your small website?

There are many options and prices for web hosting plans. The more expensive plan is capable of hosting large websites but what if a simple hosting solution is needed for your small website?

For static websites or small web applications, there are some free hosting plans that you can start up and run online right away. Usually they require less setup than a paid server.

GitHub Pages is one such free solution. This article will show you how to host a simple website using GitHub Pages.

  1. 14 Best Web Hosting is completely free and contains no ads
  2. 12 things to know when choosing a Web Hosting service
  3. Compare web hosting Bluehost and HostGator

What are GitHub Pages?

Note: To host on GitHub Pages, you need to have access to the entire site code. Typically, this option works best when you are writing your own website code from scratch.

  1. Guide to create a website for beginners

GitHub Pages is a service created by GitHub that allows publishing websites or web applications by hosting it in the free GitHub repository.

How to host a website for free with GitHub Pages Picture 1How to host a website for free with GitHub Pages Picture 1

You can host a complete website and unlimited project pages, which can be considered a 'page' on the website. The website code is stored in the specified GitHub repository, then GitHub will be published for viewing on any computer or tablet.

A few basic things about GitHub

GitHub is a popular version control service for computer programmers who use Git to store and control code. The code is stored in an archive, which is a container on the cloud server that allows access to your code from all computers.

You can create a new repository using the GitHub website or via the command line when installing Git. The named repository is available publicly or privately and stores code in any language. When creating an archive with Git, you can get the code from the server to make changes, then upload it back to GitHub.

You can easily install Git on Windows and Mac computers by visiting the Git website and following the installation instructions.

Set up a website on GitHub Pages

The process of hosting a website using GitHub Pages can be simplified into three steps:

Step 1. Create a GitHub account.

Step 2 . Create a new archive with a few rules.

Step 3 . Edit the code and upload it to GitHub to bring the site online.

Now let's get into the details of how to get your static website published directly on GitHub Pages. You need to have some knowledge of HTML to host a website on GitHub Pages.

Create a GitHub account

You should install Git to control the code via GitHub. Visit the GitHub website to register.

 https://github.com/ 

You need to choose a username, register with your email address and password. The username is important to run the website. When registering, log in to the homepage to launch your website.

Create a GitHub repository

From the GitHub homepage, you will see the repositories section on the left. It lists all your archives as well as the New button to create new archives.

How to host a website for free with GitHub Pages Picture 2How to host a website for free with GitHub Pages Picture 2

Click New to go to the new screen to enter archive information. First, you need to enter the repository name. The repository name must be as follows, where [USERNAME] is your username.

 [USERNAME].github.io 

For example, if the username is Jake, the archive name will be Jake.github.io. This is a very important step because letting GitHub Pages determine whether the repository is a direct site or an empty container wants to code.

When you enter your username, you can enter an optional description to add information to your repository (for example, a sports website).

Choose Public or Private to control the rights of users who can edit your repository. To Public means everyone can edit, Private only you can edit.

Finally, you can create a README file for the archive to keep documents for the project. You can create or not create depending on the purpose.

After filling all the information, click on Create repository to complete.

Edit and download web pages

Now that you have the repository directly on GitHub, access the command line tool. Navigate to the location where you want to save the project and run the command below, making sure to replace [USERNAME] with the actual username:

 git clone https://github.com/[USERNAME]/[USERNAME].github.io 

The git's clone function is to create a repository copy on your computer so you can edit the code. Any changes made to this code will be saved to the main repository via the command line.

Now the archive is stored in a directory, navigate to that directory using the command line tool or just click on the folder on your computer. Create index.html file inside this directory. This HTML file will contain the code.

Open the HTML file in the text editor and add the line

, type Hello. This is simply a line to display the text and ensure the site is working.

Go back to the code archive directory using the command line. You can now save changes to the repository by running this git code.

 git add --all git commit -m "Save changes" git push -u origin master 

This can be confusing if you haven't used Git before, but it's very simple.git add –all adds all changes you make to the queue to save. git commit is about to change with the -m flag, the option to add a description of what is changed in this commit. For example, Save changes above can be edited. Finally git push completes the change and loads the new code into the repository.

See the GitHub Pages website

You can now see the final result. Open a web browser and navigate to https: // [USERNAME] .github.io. Remember to replace [USERNAME] with your repository name.

You will see the website published live, viewable on any browser, on all computers, tablets or phones. This is a fully operational website.

Now that you know how to host a free website on GitHub Pages, you can build any type of static website you want. It's a great option for developers and individuals who only need a small solution.

I wish you successful implementation!

5 ★ | 1 Vote