Reto Ryter

Stack and repo setup decisions

Ticket 10grillingresolvedBlocked by: - (03, 07 resolved)

← Back to the map

Question

Decide the build stack for the site from the Angular research and the sign prototype: Angular version, application builder with prerender, zoneless or not, which modern features are used where, Nx or plain CLI, how the neon sign is brought in (copy the component in, or a package), styling approach (plain CSS with the existing custom properties, or something else), testing (Vitest, Playwright), lint and format, and that the repo is public. Also decide what from this .scratch/ map is kept in the public repo as part of the "how this site was built" story. Output: an ADR in docs/adr/ if the choice is hard to reverse; otherwise the decision in the resolution comment.

Answer

Resolved 2026-10-14. ADR: docs/adr/0001-static-prerender-no-server.md.

  • Plain Angular CLI, no Nx. ng new rryter-ch --ssr --zoneless --style=css --test-runner=vitest, then outputMode: "static", no server.ts; all routes RenderMode.Prerender; output dist/rryter-ch/browser. Angular 22.2.x, TypeScript 6, Node 24. Incremental hydration via provideClientHydration().
  • Content pipeline: scripts/build-content.ts runs before ng build, converts content/*.md and .scratch/rryter-ch-rebuild/**/*.md to JSON with rendered HTML (marked) into src/generated/; components import it; ticket routes come from the same JSON via getPrerenderParams.
  • Neon sign: copy angular/twy-neon-sign/ (six files) and both posters in; host it as @defer (hydrate on viewport) with the poster placeholder; settings per ticket 07. [email protected].
  • Styling: plain CSS with the sign's custom properties and fonts; global stylesheet plus component styles; print stylesheet. No Tailwind.
  • Tests: Vitest units (content build step, reduced-motion branch); Playwright against the prerendered dist (routes exist, hero text, via/direct on every card, poster without WebGL, print hides the sign). Test-first.
  • Lint and format: the oxc suite, oxlint and oxfmt, instead of ESLint and Prettier (Reto's choice). Trade-off accepted: no angular-eslint rules and no template linting; the Angular compiler's strict template checks carry that weight.
  • CI: GitHub Actions on push: content build, ng build, unit and e2e tests. Deploy step empty until hosting is decided.
  • Repo: rryter/rryter.ch, public from the first push. .scratch/ ships (rendered at /built). Research files merged into docs/research/ and content/source/; prototype stays on its branch. content/source/linkedin.pdf is gitignored (phone and street); the transcription carries no phone.

← Back to the map