Master Code
On The Go

Learn. Practice. Build.

How-To Guide

How to Publish a Website for Free

You've written your HTML. Now put it on the internet — for free, in 15 minutes, with GitHub Pages. No credit card, no hosting fees, ever.

🎯 What You'll End Up With

By the end of this guide, your site will be live at a real URL anyone can visit:

https://yourusername.github.io/my-website/
;

Welcome to My Website

This is live on the internet — and it's completely free.

🌐 What is GitHub Pages?

GitHub Pages is a free hosting service from GitHub that turns your repository into a live website.

What you get for free:

💡 Is it really free? Yes. GitHub makes money from enterprise plans. GitHub Pages for personal projects is genuinely free forever.

📋 What You'll Need

1

Create a GitHub Account

If you don't have one yet, go to:

👉 github.com/signup

;

Sign up with:

  • Your email address
  • A strong password
  • A username — this becomes part of your website URL, so choose carefully

💡 Username tip: If your username is alexcodes, your free site will be alexcodes.github.io. Pick something professional you'd be happy to share.

2

Create a New Repository

A repository ("repo") is a folder that stores your project.

  1. Once signed in, click the + icon in the top-right corner
  2. Choose "New repository"
  3. Give it a name — for example: my-website
  4. Add a short description (optional)
  5. Select Public (required for free GitHub Pages)
  6. Check "Add a README file"
  7. Click "Create repository"

💡 Special repo name: If you name the repository yourusername.github.io (e.g., alexcodes.github.io), your site will be served from the root URL https://alexcodes.github.io/; instead of https://alexcodes.github.io/my-website/;. Only one such repo per account.

3

Upload Your Website Files

You need at least one file called index.html — that's the homepage.

Method A: Upload via the browser (easiest)

  1. In your new repository, click "Add file" → "Upload files"
  2. Drag your index.html file into the box
  3. Scroll down and click "Commit changes"

Method B: Create the file directly on GitHub

  1. Click "Add file" → "Create new file"
  2. Name it index.html
  3. Paste your HTML code
  4. Click "Commit changes"

Method C: Push from your computer (if you know Git)

git init
git add index.html
git commit -m "First commit"
git branch -M main
git remote add origin https://github.com/yourusername/my-website.git
git push -u origin main

Don't know Git yet? See our Git guide →

4

Enable GitHub Pages

This is the step that turns your repo into a live website.

  1. In your repository, click "Settings" (top menu bar)
  2. In the left sidebar, scroll down and click "Pages"
  3. Under "Source", select "Deploy from a branch"
  4. Under "Branch", choose main and / (root)
  5. Click "Save"

You'll see a message like:

✅ "Your site is live at https://yourusername.github.io/my-website/"

Wait 1-2 minutes for the first deploy to complete.

5

Visit Your Live Website

Open a new browser tab and visit:

https://yourusername.github.io/my-website/
;

Replace yourusername and my-website with your actual GitHub username and repository name.

🎉 Congratulations! Your website is now live on the internet. Anyone in the world can visit it.

If you see a 404 page, wait another minute and refresh. First deploys can take up to 5 minutes.

6

Update Your Site (It Auto-Deploys)

Any time you edit files in the repository, GitHub Pages automatically rebuilds and redeploys your site.

Edit index.html directly on GitHub:

  1. Click on index.html in your repository
  2. Click the pencil icon (edit)
  3. Make your changes
  4. Click "Commit changes"
  5. Wait 1 minute, then refresh your live site

💡 Live editing tip: Combine this with Live Server in VS Code to preview changes locally before pushing.

7

Bonus: Add a Custom Domain

Want yourname.com instead of yourname.github.io? Here's the quick version.

1. Buy a domain

From Namecheap, Cloudflare, or Porkbun — usually $8-12/year. (Free domains exist but most come with caveats.)

2. Add it in GitHub

  1. Repository → Settings → Pages
  2. Under "Custom domain", enter your domain
  3. Click Save

3. Configure DNS at your registrar

Add these records:

# A records for root domain (yourdomain.com)
185.199.108.153
185.199.109.153
185.199.110.153
185.199.111.153

# CNAME record for www
www → yourusername.github.io

4. Enable HTTPS

Back in Settings → Pages, check "Enforce HTTPS". GitHub provisions a free SSL certificate automatically (may take up to 24 hours).

💡 Skip this for now? The github.io URL works fine for portfolios and projects. Get a custom domain once you're ready to share your site seriously.

🔧 Common Issues (and Fixes)

❌ Still seeing 404 after enabling Pages

Causes and fixes:

  1. Wait 5 minutes — first deploy is slow
  2. Confirm the file is named exactly index.html (all lowercase)
  3. Confirm it's in the repository root, not inside a subfolder
  4. Check Settings → Pages to confirm it says "Your site is live"

❌ Page loads but CSS/images are broken

Your file paths are case-sensitive on GitHub Pages (even if they work locally on Windows). Rename files to all-lowercase and update the references in your HTML.

❌ "Page build failed" email from GitHub

Usually caused by a Jekyll processing error. Add an empty file called .nojekyll to the repo root — this tells GitHub Pages to serve files as-is without Jekyll.

❌ Changes pushed but not showing

Two things to try:

  1. Hard-refresh with Ctrl+Shift+R (Windows) or Cmd+Shift+R (Mac)
  2. Check the Actions tab in your repo — see if the latest deploy succeeded

❌ Custom domain not working

DNS changes can take up to 24 hours to propagate. Use dnschecker.org to verify your records are live worldwide.

❌ GitHub Pages disabled for my account

Rare. Usually happens if a repo violates GitHub's Terms of Service (e.g., hosting pirated content or phishing sites). Check your email for GitHub's explanation.

🎯 What's Next?

You just published a website. The world is open.

← All How-To Guides