How to Deploy a website on GitHub Pages for FREE

[Shalom_Karr]

How to Deploy an Existing Public Repository with GitHub Pages

Already have a project in a public GitHub repository? This guide will show you how to quickly publish it as a live website using GitHub Pages. It’s a free and powerful way to host your static websites (HTML, CSS, JavaScript).

---

Step 1: Prerequisites - Check Your Repository

Before you start, make sure you have the following set up:

1. A Public GitHub Repository: The project you want to deploy must already exist in a public repository on your GitHub account. GitHub Pages for free accounts only works with public repos.

2. An index.html file: Your repository must contain an index.html file in the main (root) directory. This is the file that will be shown as your homepage.

If your project is missing an index.html file, you can easily add one directly on GitHub by navigating to your repository and clicking Add file > Create new file.

Step 2: Activate GitHub Pages in Your Repository Settings

This is where you tell GitHub to turn your code into a live website.

1. Go to the main page of your existing public repository on GitHub.
2. Click the “Settings” tab in the navigation bar (next to “Code”, “Issues”, etc.).
3. In the left sidebar of the Settings page, click on “Pages”.
4. Under the “Build and deployment” section, ensure the Source is set to “Deploy from a branch”. This is usually the default.
5. Under the Branch section, select main (or master if that’s the name of your primary branch) from the dropdown menu. Leave the folder as / (root).
6. Click the “Save” button.

Step 3: Visit Your Live Website!

You’re done! Now you just have to wait a moment for GitHub to work its magic.

1. After you click “Save”, the page will refresh. It can take 1-2 minutes for GitHub to build and deploy your site for the first time.
2. After waiting a minute, refresh the “Pages” settings page again. At the top, you will see a green or blue box with a message saying: “Your site is live at [your new URL]”.
3. Click the link to see your website live on the internet!

The URL will be in the format: https://your-username.github.io/your-repository-name/

How to Update Your Website

Updating your site is incredibly simple. Any time you push new changes (or upload new files) to your main branch, GitHub Pages will automatically see the changes, rebuild your site, and publish the updates. The changes will appear at the same URL within a few minutes.

---

If you have any suggestions or edits, please reply below.

And if you found this helpful, a would be much appreciated!

[ars18]

Good guide. A good alternative is Cloudflare pages. I like it better for some reason.

Maybe add a part about custom domains?

[Shalom_Karr]

@ars18

Maybe add a part about custom domains?

How to use a Custom Domain with GitHub Pages FREE (Not the Domain)

How to Use a Custom Domain with GitHub Pages So you’ve deployed your website using GitHub Pages, and you have a URL like your-username.github.io/my-cool-project. That’s great! But what if you want it to be accessible at a professional domain you own, like my-cool-project.com or www.my-cool-project.com? This guide will walk you through the entire process of connecting a custom domain you’ve purchased to your GitHub Pages site. Prerequisites Before you begin, you need two things: A deployed G…

[Shalom_Karr]

@ars18

A good alternative is Cloudflare pages.

How to Deploy a Website for FREE with Cloudflare Pages and add a Domain

How to Deploy a Website for FREE with Cloudflare Pages While GitHub Pages is a fantastic option, another top-tier, free hosting service for developers is Cloudflare Pages. It’s known for its incredible speed, robust global network, and seamless integration with GitHub. This guide will walk you through deploying a project from your GitHub repository to Cloudflare Pages. Why Use Cloudflare Pages? Blazing Fast Speeds: Your site is served from Cloudflare’s massive global Edge Network, meaning it…