105 lines
6.6 KiB
Markdown
105 lines
6.6 KiB
Markdown
# Manual launch checklist (customization and go-live)
|
||
|
||
Use this before you call the site “ready.” It covers replacing dummy content, branding, security, and infrastructure decisions only you can make.
|
||
|
||
---
|
||
|
||
## 1. Gallery content and media (replace all dummy data)
|
||
|
||
- [ ] **Create or edit your gallery manifest** — Run `npm run init:custom` once, then edit the gitignored `src/data/gallery.json` (copied from `src/data/gallery.defaults.json`). If you skip that, the app uses the committed defaults file only. Every entry must match `GalleryAsset` in `src/types/gallery.ts` (ids, `scrubbedUrl`, dimensions, `blurDataUrl`, `collection`, `tags`, copy fields, `alt`).
|
||
- [ ] **Swap SVG illustrations for real scrubbed images**
|
||
Default `scrubbedUrl` values point at `public/gallery/*.svg`. Replace with paths to your real files (e.g. `/gallery/my-photo.webp`, `/gallery/user/photo.webp`, or a CDN URL). You can delete unused SVGs from `public/gallery/` when nothing references them. Optional local-only assets: `public/gallery/user/` (gitignored contents; keep `.gitkeep`).
|
||
- [ ] **Set accurate `width` and `height`** for each asset (layout and aspect ratio depend on them).
|
||
- [ ] **Regenerate `blurDataUrl`** for each image (tiny LQIP/blur-up). The current values are simple inline SVG data URLs sized to match each dummy asset.
|
||
- [ ] **Optional: add `scrubbedSrcSet` and `sizes`** on entries that use responsive variants (e.g. Cloudflare Images). Omit if you use a single URL per asset.
|
||
- [ ] **Write honest `alt` text** for accessibility and SEO (not generic “photo”).
|
||
- [ ] **Align tags and dates** with how you want filtering and captions to read; tags drive the filter chips in the UI.
|
||
|
||
---
|
||
|
||
## 2. Collections and taxonomy (code + data must agree)
|
||
|
||
- [ ] **Decide final collection names**
|
||
Allowed values today are fixed in `src/types/gallery.ts` (`Collection` type) and mirrored in `src/components/GalleryFilterBar.vue`. If you rename or add collections, update **both** plus every `collection` field in `gallery.json`.
|
||
- [ ] **Document your tag vocabulary** (even informally) so future imports stay consistent with the chip UI.
|
||
|
||
---
|
||
|
||
## 3. Branding, copy, and site identity
|
||
|
||
- [ ] **`index.html`** — Update `<title>`, meta `description`, and `theme-color` if you change palette.
|
||
- [ ] **`src/components/AppHeader.vue`** — Site title in the header.
|
||
- [ ] **`src/views/GalleryView.vue`** — Main gallery heading and subtitle (“The Infinite Sanctuary” / Encinitas line).
|
||
- [ ] **`src/App.vue`** — Footer line (“Seaside Sanctuary - Encinitas coast” or equivalent).
|
||
- [ ] **`package.json`** — `name` field still says `seaside-sanctuary`; align with your npm/project identity if it matters to you.
|
||
- [ ] **`README.md`** — Project title and description for contributors or future you.
|
||
|
||
---
|
||
|
||
## 4. Visual design (optional customization)
|
||
|
||
- [ ] **`tailwind.config.js`** — `moonlight`, `meyer`, `succulent`, `seafoam` and font stacks (`Playfair Display`, `Source Sans 3`). Swap fonts in `index.html` Google Fonts link and here if you change typography.
|
||
- [ ] **`public/favicon.svg`** — Replace with your mark.
|
||
- [ ] **OG / social preview** — Not present today; add meta tags in `index.html` (or a small plugin) if you care about link previews.
|
||
|
||
---
|
||
|
||
## 5. Admin, AI, and security (before any public admin URL)
|
||
|
||
- [ ] **Production admin access** — Set `VITE_ADMIN_ACCESS_KEY` in your real env (see `.env.example`). In production builds, `/admin` redirects away unless `?key=` matches. Pick a long random value; never commit it.
|
||
- [ ] **Prefer edge/network controls** — Treat the query key as a **thin** gate only; typical secure-gallery PRDs assume Tunnel / IP / Worker rules for real protection. Decide and implement those outside this repo.
|
||
- [ ] **Implementation notes** — Template: `docs/IMPLEMENTATION_DECISIONS.example.md`. After `npm run init:custom`, edit gitignored `docs/IMPLEMENTATION_DECISIONS.md` with your real hosting, storage, privacy, and AI provider choices.
|
||
- [ ] **Replace mock vision** — `src/features/admin/vision.ts` and the admin store only expose a mock provider today. When you add Gemini/OpenAI/Ollama, wire keys server-side for production; do not ship real API keys in the client bundle.
|
||
- [ ] **Admin copy** — `src/views/AdminWorkbenchView.vue` intro text still describes a scaffold; align with your real workflow.
|
||
|
||
---
|
||
|
||
## 6. Ingestion and privacy (when you move past static JSON)
|
||
|
||
- [ ] **Real pipeline** — `src/features/admin/ingestion.ts` drafts are illustrative (object URLs, placeholder dimensions). Replace with server-side upload, EXIF handling, scrubbing, and storage per `BACKLOG.md`.
|
||
- [ ] **“Preserve metadata” toggle** — Decide policy; today it is UI state only until a backend enforces it.
|
||
|
||
---
|
||
|
||
## 7. Infrastructure and deployment
|
||
|
||
- [ ] **Host** — Cloudflare Pages, Vercel, or other; connect repo, set build command (`npm run build`), output directory `dist`, Node version (see `.nvmrc`).
|
||
- [ ] **Domain and HTTPS** — Point DNS; confirm TLS and redirects (www vs apex).
|
||
- [ ] **Environment variables** — Set `VITE_ADMIN_ACCESS_KEY` (and any future `VITE_*`) in the host’s dashboard for **production** builds only as appropriate.
|
||
- [ ] **CI** — `.github/workflows/ci.yml` runs on PRs; enable branch protection if you want required checks.
|
||
|
||
---
|
||
|
||
## 8. Legal, analytics, and polish
|
||
|
||
- [ ] **Privacy policy / terms** — Add pages or external links if you collect data or use third-party AI.
|
||
- [ ] **Analytics** — Add only if you want them; not in the app today.
|
||
- [ ] **Contact or about** — Add if visitors need a way to reach you.
|
||
|
||
---
|
||
|
||
## 9. After you change headings or behavior (automated tests)
|
||
|
||
- [ ] **E2E smoke test** — `tests/e2e/gallery-smoke.spec.ts` asserts the exact gallery heading text. If you rename it, update the test.
|
||
- [ ] **Run locally before deploy**
|
||
|
||
```bash
|
||
npm run check
|
||
npx playwright install chromium # once per machine
|
||
npm run test:e2e
|
||
```
|
||
|
||
---
|
||
|
||
## Quick reference: files that usually change together
|
||
|
||
| What you change | Primary files |
|
||
|-----------------|----------------|
|
||
| All photos and metadata | `src/data/gallery.json` (local override) or `src/data/gallery.defaults.json`; files under `public/` (e.g. `public/gallery/user/`) or your CDN |
|
||
| Collection list | `src/types/gallery.ts`, `src/components/GalleryFilterBar.vue`, every asset in your active manifest |
|
||
| Site name / hero copy | `index.html`, `AppHeader.vue`, `GalleryView.vue`, `App.vue` |
|
||
| Colors / fonts | `tailwind.config.js`, `index.html` (fonts), `src/assets/main.css` if used |
|
||
| Admin gate secret | `.env` (local), host env vars (prod), `.env.example` (placeholder name only) |
|
||
|
||
When every item you care about is checked off for your launch bar, you are in good shape to ship.
|