Git & GitHub ยท Chapter 35 of 42

GitHub Pages

GitHub Pages is a free hosting service that publishes static websites directly from a GitHub repository. It's ideal for project documentation, portfolios, and simple web apps.

You can enable GitHub Pages from a repository's settings, choosing a branch (often `main` or a dedicated `gh-pages` branch) and folder to publish from.

Syntax
# Settings > Pages > select branch/folder > Save

Enabling GitHub Pages

Go to repository Settings > Pages, choose a source branch and folder (like main / root or /docs), and save. GitHub then builds and hosts your site at a generated URL.

Common uses

GitHub Pages is popular for project documentation sites, personal portfolios, and simple static single-page apps built with HTML, CSS, and JavaScript.

Example 1 (bash)
git switch -c gh-pages
git push -u origin gh-pages
Output
Branch 'gh-pages' set up to track remote branch 'gh-pages' from 'origin'.

Creates and pushes a dedicated gh-pages branch, commonly used as a GitHub Pages source.

Example 2 (bash)
echo "<h1>My Site</h1>" > index.html
git add index.html
git commit -m "Add homepage"
git push
Output
[gh-pages c1a2b3d] Add homepage

Adds a simple homepage file which GitHub Pages will publish automatically once pushed.

Key points

  • GitHub Pages hosts static websites for free from a repository.
  • You choose the branch and folder to publish from in Settings.
  • It's popular for documentation sites and personal portfolios.
  • Pushing updates to the source branch automatically republishes the site.
๐Ÿ’ก Note: GitHub Pages only serves static files (HTML, CSS, JS) โ€” it cannot run server-side code like Node.js or Python backends.

๐Ÿ“ Quick Quiz

1. What does GitHub Pages provide?

2. Where do you enable GitHub Pages?

3. Can GitHub Pages run server-side code like Node.js?