Host your front-end websites for free using GitHub pages

Host your front-end websites for free using GitHub pages

A simple step-by-step guide to host your portfolio/front-end sites using github pages.

Yes, you read it correctly. GitHub pages is a service provided by GitHub to host static sites for free for a lifetime. I will walk you through each step with screenshots so that you can host your site using gh-pages.

Create a new repository

Create a new repository

Fill in the details for creating the repo

Details to fill while creating repo

Upload files to the Repo

Upload all the HTML and CSS files or files generated after production build in case of react project.

Upload files

Navigate to the Pages section of the Repo

Click on the Settings tab and Navigate to the Pages section. Make sure you are in the correct repository.

Navigate to Pages Section

Select the branch and Directory

Select the Branch and directory which contains the index.html file.

Choose branch and directory

That's it 🥳. Your deployment is completed.

You can access the deployed site on username.github.io/repository-name

Here, My site is deployed on padhysai.github.io/portfolio-test

padhysai - github user name

portfolio-test - Repository name


I hope you learnt something new by reading this post. Please like this and share this post with your friends and community, it motivates me to write more awesome blog posts.

Will see you in my next blog post :)