# Hosting Your Dashboard on Netlify — Step by Step

Netlify is a free hosting service that turns a folder containing
`index.html` into a live public website with a shareable link. The free
tier is more than enough for a dashboard like this. (Heads up on wording:
Netlify calls each site a **"project"** — so its menus say "project" where
you might expect "site.")

**Final check before you publish:** the site is about to be public. Confirm
one last time that everything behind it is aggregate data — no student-level
records, no personally identifiable information, small counts suppressed.

There are two ways to publish. Both end at the same place.

| | Method A: Drag and drop | Method B: GitHub |
|---|---|---|
| Best for | Publishing once, simplest possible | Ongoing updates over time |
| Requires | A Netlify account | Netlify + GitHub accounts |
| Updating later | Drag the folder again | Automatic when you push changes |

## Method A — Drag and drop (simplest)

1. Sign up free at [netlify.com](https://www.netlify.com).
2. Get your dashboard ready as a **folder that contains `index.html`**.
   - Built with Claude on the web? Make a new folder (e.g.
     `crestwater-dashboard`) and put your downloaded `index.html` inside it.
   - Built in VS Code? Use the site folder Claude created — it already has
     `index.html` inside.
3. In Netlify, choose **Add new project → Deploy manually**. (Shortcut:
   going to `app.netlify.com/drop` takes you straight to the drop area.)
4. **Drag the whole folder** from your computer onto the drop zone.
5. In a few seconds your site is live at a random address like
   `resonant-otter-123abc.netlify.app`.
6. Give it a sensible name: **Project configuration → Manage project
   name** → something like `mesavista-var` → your link becomes
   `mesavista-var.netlify.app`.
7. **To update later:** open your project in Netlify, go to the **Deploys**
   tab, and drag the updated folder onto the page. The link stays the same.

## Method B — GitHub (best for ongoing updates)

GitHub stores your dashboard files online; Netlify watches them and
republishes automatically whenever they change.

1. Sign up free at [github.com](https://github.com) and at
   [netlify.com](https://www.netlify.com).
2. Get your dashboard folder into a GitHub repository. Two easy ways:
   - **In the browser:** on github.com choose **New repository**, name it,
     create it, then use the **"uploading an existing file"** link and drag
     your dashboard files in.
   - **From VS Code:** if you built with Claude in VS Code, just ask
     Claude: *"Publish this project to a new GitHub repository."* It will
     walk you through it.
3. In Netlify, choose **Add new project → Import an existing project →
   GitHub**, and authorize Netlify to see your repositories.
4. Pick your dashboard repository.
5. Build settings — keep it simple:
   - **Build command:** leave blank.
   - **Publish directory:** the folder that contains `index.html` (if
     `index.html` is at the top of the repository, leave this as the
     default).
6. Click **Deploy**. Your site goes live at a random address; rename it
   under **Project configuration → Manage project name**.
7. **To update later:** change the files in GitHub (or have Claude push an
   update from VS Code). Netlify notices and republishes on its own —
   usually within a minute.

## Good to know

- **It's really free** for this use — no credit card needed at signup.
- **Treat the link as fully public.** Anyone with the URL can view it, and
  search engines can index it. That's fine — as long as everything behind
  it is aggregate data with small counts suppressed.
- **Custom domains** (like `dashboard.yourcollege.edu`) are possible later;
  that's a conversation with your IT department, and Netlify supports it.
- **Something looks broken on the live site but fine locally?** Most often
  the folder was missing `index.html` at its top level, or a file was
  renamed. Re-check the folder contents and drag it in again.