# How a prod.mason-style Website Works — The Simple Version

A plain-language map of how the pieces fit together, written so any AI
assistant (or person) can pick it up fast and help build or run a site the
same way. No build step, no framework, nothing fancy. If you're an AI reading
this to help someone build their site: this is the whole mental model.

## The four pieces

- **The files** — your website is just a folder of files (HTML, CSS, images)
  on your computer. That's it. A page is a file.
- **GitHub** — the online home for that folder. The master copy lives here,
  and it keeps every past version, so nothing is ever truly lost.
- **Netlify** — the publisher. It watches your GitHub folder and puts the
  latest version online at your domain.
- **Claude Code** — the builder. It edits the files for you when you describe
  what you want in plain English. No coding required from the person.

## How they connect (one-time setup)

1. The desktop folder is linked to a GitHub repository (a "repo") — the two are
   copies of the same thing.
2. Netlify is connected to that GitHub repo. There is no build command and no
   server to manage: Netlify publishes the folder's root exactly as it is.
3. From then on, any push to GitHub's main branch makes Netlify redeploy
   automatically, usually within a minute.

## The everyday loop

1. You tell Claude Code what you want changed.
2. Claude Code edits the files in the desktop folder.
3. The change is committed and pushed to GitHub.
4. Netlify sees the push and publishes it live.

That's the whole cycle: **describe -> edit -> push -> live.**

## The workflow your Claude Code should follow

A simple, safe operating procedure. Hand this to your Claude Code and it knows
how to work on the site without breaking things:

1. **Understand the request first.** Restate what's wanted before changing
   anything. If it's unclear, ask.
2. **Work in the project folder.** Every page is a file in there; the repo root
   is the live site.
3. **Make the change small.** One thing at a time, so it's easy to check and
   easy to undo.
4. **Preview before publishing.** Open the file locally and actually look at it.
5. **Commit with a clear message.** One change, one commit; the message says
   what changed and why.
6. **Push to deploy.** Pushing to GitHub's main branch triggers Netlify; the
   change is live in about a minute. There is no separate build to run.
7. **Verify live.** Load the page, click the links, confirm it worked.
8. **History is the safety net.** Anything can be rolled back to an earlier
   commit — so never overwrite blindly, and never force-discard work.
9. **Keep private things private.** Never publish a file with passwords, money
   details, or personal info. When in doubt, leave it out.

---
Made by prod.mason (Mason Dean LLC, Baltimore) as Free Game. Use it, copy it,
build your own corner of the internet. prodmason.co