Hosting your webpage on Github Pages

RaunakBanerjee
Quick Code
Published in
3 min readJan 13, 2021

Hey. I am Raunak, an engineering student. I recently started learning Javascript and have been building a few small projects and wanted to host them. You have Heroku and other tools but I reckon setting them up takes a bit of time. Github pages are really cool for hosting small static websites and in my opinion ,beginners should give them a try as they give u the option of naming your url and is really easy to set them up.

Here is how u can set up a Github page.

First, set up your Github account.

Now, go to the repositories section and make a new one.

This is how your screen will look when you click on create new repository

Give a repository name(I am naming this demo file as hello) and add a read me file. Read me files will help you attach a description to your project.

Next after you create your repo, you need to change the name of the branch. Look at the left top side of your page, you will see this photo.

My branch name by default is named as main.

Click on the dropdown beside main and write gh-pages,and add another branch. But doing this is not enough, as now you have 2 branches, main and gh-pages.

See that two branches are presenet.Make sure you set gh-pages as your primary branch.

You want to set the branch name gh-pages as your primary branch. So now go to Settings and on the left side, click on BRANCHES .After clicking on Branches you will see something like this.

Change the main brown by clickcing on the lookalike pencil button on the right side and write gh-pages and update.

And now you are good to go. You have created your own personalized Github page.

To see your github domain name,click on settings,which is at the the right hand part of the photo shown below.

Now scroll down to the Github pages section

Here you will find your url where your project will be hosted.

Also this is very important. When u are adding the HTML file in the add file section, make sure the html file is named as index.html, or else would would need to make extra modifications.

This is very important.

Cheers

Raunak.

Twitter: https://twitter.com/itsraunak_

Github:https://github.com/raunakbanerjee

--

--

RaunakBanerjee
Quick Code

Sports aficionado,average guitar player, Led Zeppelin fan