# 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 ``, 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.