How To Host Your Webpage on GitHub Pages

[Participant @yusuf]

In this post, you will learn how to host your web page on GitHub pages. GitHub is a platform for software version control using Git. It provides a safe home for your code so that even when your computer gets damaged or stolen, you can still access your code through your GitHub login details and make the changes you desire. There are many version control systems like SVN (Subversion) and Mercurial, but Git remains the most popular. GitHub serves as a place where developers showcase their work. We are going to walk through the process of setting up a web page using GitHub pages. This website will run live online for everyone to see, this is done free of charge.

Getting a free live project hosting was not a popular thing decades ago. There were no provisions to obtain free services that give room to host a project. Technology has evolved over the years and services like Netlify, Heroku, 000Webhost, etc are doing developers the favor of hosting their projects free. GitHub pages offer a feature that allows developers to host their static websites too.

Let’s get started right away into the walkthrough:

Creating a GitHub Account

The first requirement to successfully create a GitHub page is having an account on github.com. There is a signup form for signing up new users on the homepage. Just fill in your details and confirm your email. You are now in a position to create repositories, contribute to open source, and of course, create a Github page (which is the aim of this post). Below is the screenshot of the GitHub homepage.

Creating a GitHub repository

Having a repository is critical to creating a GitHub page. The source code contained in the repository becomes the source code of the web page. Simply a repository can be referred to as the container in a particular location used to store your project files. The local repository is situated on your computer while the remote repository is located somewhere on the cloud. GitHub allows you to create public repositories for free and you pay some fees for private repositories. To create a new repository, click the “New” button, enter the repository name and click the “Create repository” button.

You now have a repository to work with.

Setup GitHub Pages

Click the Settings tab, which is the leftmost tab, and scroll down to the GitHub Pages category. Select the Master branch from the source select button (this will serve as the source code of your website). A URL will be created where your web page will be published and accessed.

Create your web page source file

To create the source file, click on the code tab and create a new index.html file that will serve as your web page, edit the content, scroll down and click on the “commit new file” button. You have now created an index.html file and created your web page ready to be viewed live.

To view your website. Go back to the settings tab and scroll to the GitHub pages section. Click on the URL where your page is hosted, the URL is in the format of username.github.io/repo-name. Your webpage will appear on the browser, you have now successfully hosted your web pages without paying for hosting and domain.

[Author]

Posts