If you want free hosting for a static site and you like simplicity with a hint of magic then GitHub Pages is the place to be. This guide walks you through hosting HTML CSS and JavaScript without drama and with a few sarcastic asides for flavor. You will learn how to create a repo add your files push changes enable Pages and optionally point a custom domain so your site looks professional and not like a local file dump.

Quick checklist before you start

• GitHub account
• Public repository for free hosting
• Static assets: index.html plus CSS and JS
• Optional custom domain and access to DNS settings

Create the repository

Click New repository on GitHub and pick public if you want free hosting. For a user site name the repo exactly username.github.io where username matches your account. Project sites can use any name and will be served under username.github.io/repo. Naming matters unless you enjoy confusion.

Add your static files

Drop an index.html in the repo root and organize styles and scripts how you like. A single index.html in the root becomes your homepage. Keep paths tidy so the browser does not need to play detective.

Push changes to GitHub

Use the web upload or a local git workflow. A minimal sequence looks like this

git init
git add .
git commit -m 'Initial commit'
# add the remote URL from the new repo page
git remote add origin https://github.com/USERNAME/REPO.git
git push -u origin main

If you prefer a gh pages branch for a project site create and push that branch instead. The commands remain the same except replace main with gh-pages where appropriate.

Enable GitHub Pages from settings

Open the repository settings and find Pages. Choose a publishing source such as the main branch and the root folder. Save and be patient while GitHub builds your site. If the page fails to publish check the build logs in the settings to see what went wrong. The logs will tell you if a missing index.html or a bad asset path caused the outage.

Pick the right branch and folder

Project sites commonly use the gh-pages branch or the main branch. User and organization sites publish from the special username.github.io repository root. Choosing the wrong branch is a classic mistake and leads to serving the wrong folder or an embarrassing 404.

Custom domain setup

To use a custom domain add a CNAME file to the repo with your domain name or enter the domain in the Pages settings. Then configure your DNS provider to point the domain to GitHub Pages. DNS changes can take a while so pour a coffee and wait.

DNS records to create

• For apex domains add the A records that GitHub recommends such as 185.199.108.153 185.199.109.153 185.199.110.153 185.199.111.153
• For subdomains use a CNAME record that points to username.github.io

Once DNS propagates GitHub will attempt to provision a TLS certificate and serve your site over HTTPS. That may add a short delay but it is worth it for secure cookies and fewer worried visitors.

Tips and common gotchas

• Make the repository public for free hosting if you do not have a paid plan.
• Ensure index.html is in the published folder so the homepage loads.
• If your site uses relative paths test locally with a simple server or the paths will fail on GitHub Pages.
• Custom domain setup may need a CNAME file and matching Pages setting to avoid redirect loops.
• Check the Pages build logs for HTML or asset errors before blaming GitHub.

There you go. You now have a predictable deployment path for static sites using GitHub Pages. It is reliable affordable and shockingly easy to update. Push changes and your site will refresh like clockwork unless you break something dramatic. Then you have version history to fall back on and the satisfaction of reverting your mistake like the responsible developer you pretend to be.