Files

T

joshuaandClaude Opus 5.5 54ae9c49a1 Tested: static Astro site answering hard Bible questions

Built from the kit specs (CLAUDE.md, docs/01-05): question index import,
status seals, connections graph, Pagefind search, Scripture margin,
and 157 evidence articles (drafts unless published) with sources and
verified "Learn more" links. Includes link, owner-notes, a11y and
publish scripts.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

2026-10-03 10:46:19 +02:00

3.6 KiB

Raw Permalink Blame History

04 — Build plan

Work in order. Finish each phase, run the build, then stop and report what changed and why.

Phase 1 — Scaffold

Create the Astro project in the repo root (TypeScript strict, MDX, sitemap). Keep CLAUDE.md, docs/, brand/, content/ and scripts/ as they are.
Add src/site.config.ts with name "Tested", tagline "Test everything. Hold fast what is good.", placeholder URL.
Install fonts via Fontsource; add tokens.css and base.css from the design system.
Add npm run import, npm run icons, npm run build (astro build, then Pagefind), npm run preview.
Add .editorconfig and Prettier (with the Astro plugin) so WebStorm formats consistently.

Done when: npm run dev shows a blank page using the right fonts and background, and npm run build passes.

Phase 2 — Data

Make scripts/import-index.mjs work against content/source/question-index.md (it's provided; adjust if the export format differs, and report what you changed).
Write src/lib/questions.ts: typed loaders, getQuestion(id), getGroup(id), getRelated(q), status and domain counts.
Validate: every related id resolves, every status is valid, no duplicate ids. The import fails loudly with a list of problems.

Done when: import produces all groups and questions, and validation passes or lists exact problems.

Phase 3 — Brand and icons

Copy brand/*.svg into place; write scripts/build-icons.mjs using sharp to output favicon.ico, favicon.svg, apple-touch-icon.png, icon-192.png, icon-512.png and og-image.png into public/.
Add site.webmanifest and all head tags.

Done when: the favicon shows in the browser tab in light and dark mode, and the OG image renders at 1200×630.

Phase 4 — Core pages

Layout shell: header with logo and nav, footer, skip link, theme toggle (respects system preference, remembers choice).
StatusSeal, QuestionRow, ShortAnswer, Marginalia components.
Question page, questions list with URL-driven filters, group pages, About page (explains the statuses and domains using docs/05-content-rules.md), 404.

Done when: every question has a working page, filters work and survive a reload, and pages pass an axe accessibility check with no serious issues.

Phase 5 — Signature visuals

ArcDiagram on the home page, rendered as SVG at build time from graph.ts, with a small script for hover, focus and click. Arcs draw in once on load; respect reduced motion.
ConnectionsGraph on /connections/ with D3, plus the accessible list fallback.

Done when: hovering a question on the home page highlights its arcs and shows its title, keyboard users can tab through questions, and the graph runs smoothly on a mid-range phone.

Phase 6 — Search and SEO

Pagefind search in the header and on the home page, styled with the tokens.
Meta tags, canonical URLs, JSON-LD FAQPage, sitemap, robots.txt.
Build-time check that authorNotes text never appears in dist/.

Done when: searching "Enoch" finds the Enoch questions, and Lighthouse scores 95+ for performance, accessibility, best practices and SEO on a question page.

Phase 7 — Articles

Content collection for src/content/articles/ with a schema matching the article structure in docs/05-content-rules.md.
Article template rendering the sections with proper headings and a sources list.
Create one sample article stub for 7.9 ("Did Jesus rise from the dead?") with section headings and TODO markers only. The owner writes the content.

Done when: a question with an MDX file shows the full article; others show the short answer and "Full article coming".

3.6 KiB Raw Permalink Blame History Unescape Escape