How to host your website on GitHub Pages in 5 minutes?

Reading time: 2 minutes

Now, you have finally made your website using HTML, CSS and JavaScript, but now you need to host it on some platform for free. So, where will you want to host the website of yours?

There are many options to try out web hosting; Netlify, Vercel, Amazon S3 etc.

But here, in this article, we will be hosting our website on something called GitHub Pages in just 5 minutes.

What is GitHub Pages?

GitHub Pages is a static site hosting service by GitHub which takes the necessary files from your git repository (HTML, CSS and JavaScript files), builds them, and publishes the website for you.

You can use a custom domain along with the GitHub Pages to host your website without that "github.io" sub-domain.

How to GitHub Pages?

So, let's start!

I have made a sample website that just shows "Hello World" and a button which when clicked will generate some sentences.

This is how it looks like:

All the files will be present in a GitHub repository which I have linked to, at the end of this article.

Now, onto the steps:

• Push all your files to a GitHub repository.

• Go to Settings.

• Scroll down until you see Pages tab on the left and click on it.

• Under the Branch sub-heading, click on the tab that shows None and then select main.

• Click Save.

• The GitHub Pages source is saved and now, you can wait for sometime until your website is published.

• Try reloading the current page 2-3 times until you get the below page.

• Your website is ready! Now you can click Visit Site to see your website!

Congratulations! You have hosted your website on GitHub Pages in 5 minutes!

I hope you have learnt something new and as always, Happy Learning!

If you would like to follow me, you can follow me on LinkedIn.

Here's the GitHub repository: https://github.com/khairalanam/Hello-World