Lesson 04 · GitHub platform · pages

Pages

Free static-site hosting baked into every repo. Push HTML, get a live URL — no server, no deploy script, no hosting bill.

You've tracked work with issues, automated checks with Actions, and organised it all with Projects. Now the output: GitHub Pages takes static files (HTML, CSS, JS) from a repo and publishes them as a real website. No server-side code runs — it's just your files, served globally, for free.

Two kinds of site

Type	Repo name	URL	Limit
User / org site	`<username>.github.io`	`https://<username>.github.io`	One per account
Project site	Any repo name	`https://<username>.github.io/<repo>`	Unlimited

For this repo, if you enable Pages, the URL would be:

https://stianbranden.github.io/learning

That's a project site — the repo name becomes the path. The index.html already in this repo would become the homepage.

Two publishing sources

Every Pages site has a source — where GitHub looks for the files to publish. There are exactly two options:

Deploy from a branch

Pick a branch (main, gh-pages, any) and a folder (/ root or /docs). Every push to that branch rebuilds the site from those files — no build step, just serve what's there.

Use when: plain HTML/CSS/JS, no build needed

GitHub Actions

A workflow builds the site (using any tool — Vite, Hugo, Jekyll, anything) then deploys the output with actions/deploy-pages. More setup, total control.

Use when: site needs a build step (framework, generator)

For plain HTML like this learning workspace, deploy from a branch is the right choice — zero config, just push and it's live.

Setting it up (branch deploy)

The entire setup is four clicks:

Go to your repo on GitHub → Settings (top nav).
In the left sidebar, click Pages.
Under "Build and deployment" → Source, select Deploy from a branch.
Choose the branch (main) and folder (/ (root)). Click Save.

Within a few minutes, your site is live. A green banner in the Pages settings shows the URL.

The /docs folder option If you don't want your site files cluttering the repo root, put them in a /docs folder and select that as the source. This is common for project documentation that lives alongside source code. It only works with branch deploy — Actions workflows build from wherever your workflow tells them to.

What Pages is not

Mental guardrails worth having early:

No server-side code. No PHP, no Python, no Node.js backend. If it doesn't run in a browser, Pages won't run it.
Private repo ≠ private site. On GitHub Free, a Pages site is always publicly accessible, even if the repo is private. Don't put sensitive data in a Pages site.
Not for commercial web apps. It's a static hosting service with a soft bandwidth cap (~100 GB/month) and a 1 GB size limit. Documentation, course notes, portfolios — yes. Production SaaS — no.

Jekyll — the built-in option you can ignore Pages has a built-in static site generator called Jekyll. If your repo contains Markdown files and no index.html, Pages will try to process them through Jekyll automatically. For this workspace we already have HTML files, so Jekyll does nothing — it passes them through untouched. Worth knowing it exists, not worth learning right now.

How this connects

Pages closes a loop with what you already know:

Issues track what to build → PRs deliver the change → Actions check it → Pages publishes it.
An Actions workflow can be the publishing source — so CI and deploy are the same pipeline.
A Project board can track which pages/features are done and which aren't.

For this repo specifically: the course you're reading right now — these HTML lesson files — could be a live website in under a minute by enabling Pages on main.

Your win — publish this repo as a live site

Go to Settings → Pages on this repo.
Set Source to Deploy from a branch, branch main, folder / (root). Save.
Wait 1–2 minutes, then visit https://stianbranden.github.io/learning.
You should see the root index.html — the course index — live on the internet.
Click through to a lesson and confirm it works.

That's it. Every future push to main auto-updates the site. Your learning workspace is now a published website.

Go deeper

Primary source — read this one: GitHub Docs — About GitHub Pages. Covers site types, limits, Jekyll, and custom domains.

Then configure it: GitHub Docs — Configuring a publishing source. Step-by-step for both branch deploy and Actions deploy.