How to Upload a Website to GitHub- Complete Tutorial

How to Upload a Website to GitHub: Complete Tutorial

GitHub Pages lets you host static websites for free. No server costs, no complex setup. Just upload your files and your site goes live.

This guide covers everything from creating your first repository to getting your site live. No fluff, just the steps that work.

What You Need Before Starting

If you don't have a website built yet, build that first. This tutorial assumes you have files to upload.

Step 1: Create a GitHub Account

Go to github.com and sign up. Use a username you'll be okay showing publicly—your site URL will include it.

Click Sign up, pick a username, enter your email, and create a password. Verify your email when GitHub sends the confirmation.

Step 2: Create a New Repository

A repository is just a folder where your project lives. Here's how to make one:

  1. Click the + icon in the top right corner
  2. Select New repository
  3. Name it something specific, like my-website
  4. Keep it Public (required for free GitHub Pages)
  5. Check Add a README file
  6. Click Create repository

Naming Your Repository

Your repository name determines your URL. If your username is johnsmith and repo is my-website, your site becomes:

johnsmith.github.io/my-website

There's one exception: if you name the repo username.github.io, it becomes your main URL at username.github.io.

Step 3: Upload Your Website Files

You have two options here. Pick what works for you.

Option A: Upload Directly (Easiest for Beginners)

On your new repository page:

  1. Click Add file dropdown
  2. Select Upload files
  3. Drag and drop your website files, or click choose your files
  4. Make sure your main HTML file is named index.html
  5. Scroll down and click Commit changes

Option B: Use Git Command Line (Better for Updates)

If you plan to update your site regularly, cloning locally saves time:

git clone https://github.com/username/my-website.git
cd my-website
# Copy your files into this folder
git add .
git commit -m "Initial upload"
git push origin main

This requires Git installed on your computer. If you've never used command line Git, stick with Option A for now.

Step 4: Enable GitHub Pages

Uploading files isn't enough. You need to turn on the hosting feature:

  1. Go to your repository's Settings tab
  2. Scroll down to Pages section
  3. Under Source, click the dropdown and select Deploy from a branch
  4. Select main branch and / (root) folder
  5. Click Save

Your site will take 1-5 minutes to appear. Don't panic if it doesn't show up immediately.

Step 5: Check Your Live Site

After enabling GitHub Pages, your site URL is:

https://username.github.io/repository-name

Open this URL in a new browser tab. If you see your website, you're done. If not, wait a few minutes and refresh.

Common Problems and Fixes

404 Error on Your Site

Your main file must be named index.html (lowercase, no spaces). GitHub looks for this specific file.

Site Not Updating

GitHub caches aggressively. Clear your browser cache or try an incognito window. Updates can take up to 10 minutes to show.

Repository Set to Private

Free GitHub accounts only get Pages hosting for public repositories. Change your repo to Public in Settings if you're on the free plan.

CSS/Images Not Loading

Check your file paths. Use relative paths in your HTML:

<!-- Wrong -->
<link rel="stylesheet" href="C:\Users\You\Desktop\style.css">

<!-- Correct -->
<link rel="stylesheet" href="./style.css">

Uploading Methods Compared

Method Best For Difficulty Speed
Direct Upload (Browser) First upload, small sites Easy Slow for many files
Drag and Drop Quick updates Easy Medium
Git Command Line Regular updates, developers Medium Fast
GitHub Desktop App Non-coders who want Git benefits Easy Fast

Quick Reference: Upload Checklist

Using a Custom Domain

If you own a domain like mysite.com, you can point it to GitHub Pages:

  1. In your repo's Settings → Pages
  2. Enter your domain under Custom domain
  3. Add the required DNS records at your domain registrar
  4. Wait for DNS propagation (up to 48 hours)
  5. Check Enforce HTTPS once DNS updates

GitHub has built-in support for most DNS providers. The basic records you need are an A record pointing to GitHub's IPs and a CNAME for the www subdomain.

What's Next After Uploading

Your site is live, but there's more you can do:

That's it. Your website is now live on GitHub Pages, and you can update it anytime by uploading new files to your repository.