Lecture slides on SSG Book

Course introduction

Mon, 01 Jan 0001 00:00:00 +0000

Static Site Generators in the Age of AI

Building and Maintaining Content with AI Agents

Chapter 0: Course introduction

Polla Fattah

What you will build

One small website that grows from chapter to chapter.

A working site on your own computer in Chapter 1
Published at a public address by Chapter 7
Improved by an AI agent, with every change reviewed by you
A plan for a website of your own in Chapter 19

Why a static website?

Your content is plain text in folders you control
The build produces ordinary files any browser can read
Hosting can be free: GitHub Pages serves public projects at no charge
Every change is recorded in Git and can be undone

What “static” means

A static site generator combines your writing, a layout, and settings into finished web pages before anyone visits.

Your First Hugo Website

Mon, 01 Jan 0001 00:00:00 +0000

Your First Hugo Website

Static Site Generators in the Age of AI

Chapter 1

Polla Fattah

Today’s goal

A readable home page headed My Knowledge Notebook, running on your own computer.

Success means you can say:

I know which file contains these words, I can change them, and I can put them back.

By the end of today you can

Start and stop a local Hugo preview
Find and edit the file that holds the home-page introduction
Explain the roles of the content file, the layout, and the browser preview
Recover from a small mistake and keep a working copy

No HTML, CSS, Git, or programming experience is needed.

Write and Publish Content Locally

Mon, 01 Jan 0001 00:00:00 +0000

Write and Publish Content Locally

Static Site Generators in the Age of AI

Chapter 2

Polla Fattah

Today’s goal

Give your website its first article: a short note about something you have learned.

Sections, a link, a screenshot, and a code sample
Reachable from the home page

Publish locally means it appears in the preview on your computer. Nothing goes online today.

Organise a Useful Website

Mon, 01 Jan 0001 00:00:00 +0000

Organise a Useful Website

Static Site Generators in the Age of AI

Chapter 3

Polla Fattah

Today’s goal

You know where your files are. A new visitor does not.

Give them clear routes through the site:

An About page
Landing pages for Articles and Projects
A short Resources page
Navigation that works on every page

Every destination must contain something useful.

Understand the HTML Behind Your Pages

Mon, 01 Jan 0001 00:00:00 +0000

Understand the HTML Behind Your Pages

Static Site Generators in the Age of AI

Chapter 4

Polla Fattah

Today’s goal

See what the browser receives when it shows your pages.

The title is not just large text; the navigation is not just coloured words
Both have a structure the browser interprets

That lets you make deliberate changes, diagnose mistakes, and judge code an AI agent suggests.

Practical CSS for Your Hugo Site

Mon, 01 Jan 0001 00:00:00 +0000

Practical CSS for Your Hugo Site

Static Site Generators in the Age of AI

Chapter 5

Polla Fattah

Today’s goal

Three small, deliberate changes:

The footer note sits below a thin rule, in quieter text
Body text reads a little larger
Article section headings get more space above them

Everything else should look as it did after Chapter 4.

Enough CSS to customise this site and check an agent’s changes; not a design course.

Track and Recover Your Hugo Site with Git

Mon, 01 Jan 0001 00:00:00 +0000

Track and Recover Your Hugo Site with Git

Static Site Generators in the Age of AI

Chapter 6

Polla Fattah

Today’s goal

Backup folders helped, but they are awkward to compare.

Which copy has the footer improvement?
What changed in the stylesheet?
Can I recover one file without replacing the whole site?

Git gives the project a history of recorded checkpoints. Today it stays local: no GitHub account yet.

Publish Your Hugo Site with GitHub Pages

Mon, 01 Jan 0001 00:00:00 +0000

Publish Your Hugo Site with GitHub Pages

Static Site Generators in the Age of AI

Chapter 7

Polla Fattah

Today’s goal

Give your website an address other people can visit.

Put the repository on GitHub
Let GitHub Actions build it with Hugo
Publish the result through GitHub Pages
Follow one small update from your editor to the live page

A supplied workflow, explained: no need to master Actions or YAML first.

Work with an AI Agent on Your Hugo Site

Mon, 01 Jan 0001 00:00:00 +0000

Work with an AI Agent on Your Hugo Site

Static Site Generators in the Age of AI

Chapter 8

Polla Fattah

Today’s goal

Ask an agent for one small, checkable change: a short section on the Resources page explaining how to use its links.

One new heading and three bullets
In one Markdown file
Reviewed by you before it is kept

We use Codex CLI. The aim is a repeatable method, not a tour of every AI tool.

Give Your Hugo Content a Consistent Structure

Mon, 01 Jan 0001 00:00:00 +0000

Give Your Hugo Content a Consistent Structure

Static Site Generators in the Age of AI

Chapter 9

Polla Fattah

Today’s goal

After a few projects, one page explains its purpose, another lists tools, and a third never says whether the work has started.

Agree what every project page should explain
Build a reusable starter for new projects
Add a second project: a planned reading list

A shared structure is easier to write, compare, maintain, and hand to an agent.

Use Hugo Templates to Display Your Content

Mon, 01 Jan 0001 00:00:00 +0000

Use Hugo Templates to Display Your Content

Static Site Generators in the Age of AI

Chapter 10

Polla Fattah

Today’s goal

Your projects store a description, a status, and tools, but visitors cannot see them. And you still keep the Projects list by hand.

Display a description
Show status and tools when they exist
Let Hugo generate the Projects list

Change a description once; it updates everywhere Hugo uses it.

Build Reusable Hugo Layouts

Mon, 01 Jan 0001 00:00:00 +0000

Build Reusable Hugo Layouts

Static Site Generators in the Age of AI

Chapter 11

Polla Fattah

Today’s goal

One layout now does everything. It works, but every change needs care.

A base template for the shared document
Small partials for reusable pieces
A section template for Projects

Reorganising working code should preserve its behaviour. Check that first.

By the end of today you can

Move a component into a partial and pass it the context it needs
Connect a base template’s named block with its definition
Give Projects its own layout, sharing the rest
Check that content, links, and metadata survived the move

Start from Chapter 10, with status in the project list, and a clean tree (companion branch chapter-10).

Build a Resource Directory with JSON

Mon, 01 Jan 0001 00:00:00 +0000

Build a Resource Directory with JSON

Static Site Generators in the Age of AI

Chapter 12

Polla Fattah

Today’s goal

As the Resources list grows, every entry should carry the same information: a title, an address, a short explanation, and a few topics.

Store the repeated details in JSON
Let a Hugo partial display them
Keep the introduction and notebook links in Markdown

Add a resource by editing data; the template supplies the HTML.

Create and Maintain Content with AI Agents

Mon, 01 Jan 0001 00:00:00 +0000

Create and Maintain Content with AI Agents

Static Site Generators in the Age of AI

Chapter 13

Polla Fattah

Today’s goal

Chapter 8 was three bullets. Real content work is larger, and harder to check.

One new article, written from notes you supply
Linked from Articles, Home, and the resource directory
Three requests: a plan, a draft, a coordinated update

Supply the material, bound the task, check every claim, decide yourself.

Check Every Contribution with CI/CD

Mon, 01 Jan 0001 00:00:00 +0000

Check Every Contribution with CI/CD

Static Site Generators in the Age of AI

Chapter 14

Polla Fattah

Today’s goal

Every change so far went straight onto main, and every push to main publishes.

A second workflow that examines a proposal before it goes live
A branch and a pull request
A rule broken on purpose, and stopped

Machines check what can be a rule; you check the rest.

Help Readers Find and Use Your Content

Mon, 01 Jan 0001 00:00:00 +0000

Help Readers Find and Use Your Content

Static Site Generators in the Age of AI

Chapter 15

Polla Fattah

Today’s goal

A visitor has the navigation, and nothing else. They cannot search, and every tab title looks alike.

A distinct title and a description for every page
The sitemap and feed Hugo has generated all along
A Search page that filters as the reader types

And a page that still lists every destination when JavaScript does not run.

Publish in Multiple Languages

Mon, 01 Jan 0001 00:00:00 +0000

Publish in Multiple Languages

Static Site Generators in the Age of AI

Chapter 16

Polla Fattah

Today’s goal

Add Kurdish Sorani as a second language: a Kurdish home page and About page at /ckb/.

Translated navigation and a language switcher
The right language and text direction for every page
The layout working right to left
The English site unchanged at its existing addresses

Arabic, or any other language, works the same way.

Add Interactive Features Responsibly

Mon, 01 Jan 0001 00:00:00 +0000

Add Interactive Features Responsibly

Static Site Generators in the Age of AI

Chapter 17

Polla Fattah

Today’s goal

A contact form is where a static site meets its actual limit.

Build a proper, accessible form
Watch it fail to send
Make it work the one way that collects nothing: the visitor’s own mail program

Where does the work happen, and at what cost?

Maintain, Migrate, and Recover

Mon, 01 Jan 0001 00:00:00 +0000

Maintain, Migrate, and Recover

Static Site Generators in the Age of AI

Chapter 18

Polla Fattah

Today’s goal

A site nobody maintains does not stay still: it goes quietly out of date while appearing to work.

A maintenance pass over the site you have
Update what you depend on; archive superseded work
Publish a mistake on purpose, and recover from it live
Credentials, licensing, privacy, cost, and ownership

By the end of today you can

Run a repeatable maintenance pass and act on what it finds
Update a pinned dependency in every place it is pinned
Retire a page without breaking a published address
Undo a live change without rewriting published history

Start from Chapter 17 (branch chapter-17): clean, pushed, and deployed.

Build Your Own Publishing Project

Mon, 01 Jan 0001 00:00:00 +0000

Build Your Own Publishing Project

Static Site Generators in the Age of AI

Chapter 19

Polla Fattah

Today’s goal

You have done every step once, deliberately. Now the decisions are yours.

Choose a project you can finish
Write a brief that says what you are not building
Pick features by what they cost to keep
Test the brief before building, then deliver

A site a stranger can use, you can maintain in a year, and whose quality you can account for.