Signal & Systems Engineering Website

This site. A $0 documentation and portfolio site on Astro, Starlight and Cloudflare Pages, built with Claude.

Status: In progress
Category: Software and Automation
Started: 2026-10-25
Last updated: 2026-10-26

Release

Site details

Framework: Astro 7.4.2
Docs theme: Starlight 0.42.7
Hosting: Cloudflare Pages, free tier
Deploys: Automatic on every push to main
Address: signal-and-systems.pages.dev
Budget: $0

Goal

Give every project one public home where the parts, wiring, code and test results are written down in the same format, and where it is always clear what has and has not been tested. The site also serves as a portfolio of how I plan, build and document systems.

Constraints

Budget: $0. Free hosting, free tools, and no paid services without a decision first.
Privacy: no home address, phone number, VIN, plate, permit numbers or parking locations. Photos have location data stripped. Scanner examples use synthetic IDs only. No employer confidential data and no unpublished emergency-communications details.
Honesty: no invented metrics. Every page has a testing section that says what was not tested.
Consistency: every project page follows the same 12-section template.

Architecture

MDX pages in GitHub ─► push to main ─► Cloudflare Pages build (astro build, Node 24) ─► static site on pages.dev

The site is fully static. Content lives in src/content/docs/ as MDX files, and reusable components (header card, status badges, spec box, parts table, wiring table, callouts, changelog, gallery, before/after slider, download card and project grid) live in src/components/.

How it was built with Claude

I wrote the site plan: the name, design tokens, menu, categories, status badges, page template and privacy rules. Claude built the site from that plan, checked the name and domain options, wrote the components and the first project pages, and turned my F-150 project document into the upfit overview and CanTrol output plan. Changes ship as pull requests that I review before they reach main.

Parts list

Part	SKU	Price paid	Key specs	Source	Status
Astro	TBD	TBD	Static site framework	Manufacturer	Installed
Starlight	TBD	TBD	Documentation theme with built-in search	Manufacturer	Installed
Fontsource: Space Grotesk, Inter, JetBrains Mono	TBD	TBD	Self-hosted fonts	Manufacturer	Installed
Cloudflare Pages	TBD	$0	Free static hosting	Manufacturer	Installed
Cloudflare Web Analytics	TBD	$0	Cookie-free, aggregate page views	TBD	Planned

Configuration

Build command: npm run build
Output directory: dist
Environment: NODE_VERSION=24
New project page: copy src/content/docs/projects/_template.mdx, fill in the frontmatter, and set project: true so it appears in the project grid.

Build steps

Write the site plan: name, design, menu, page template and privacy rules.
Scaffold Astro and Starlight, and add the design tokens and fonts.
Build the documentation components.
Publish the first project pages.
Connect the GitHub repository to Cloudflare Pages.

Testing and verification

Check	Status
`npm run build` passes	Yes, on every change before it is merged
Dark mode, light mode and phone width	Checked by screenshot at launch
WCAG AA color contrast	Computed for every token pairing at launch. All pass
Live deploy on Cloudflare Pages	Yes (2026-10-26)
Broken-link check on the live site	Not yet
Page-speed check on the live site	Not yet

Safety notes

Run the publishing checklist before every new page.
Never commit secrets or tokens to the repository.

Lessons learned

A fixed page template keeps every project honest about what has and has not been tested.

Open items

Turn on Cloudflare Web Analytics.
Set up the contact form.
Decide on a custom domain.
Run a broken-link and page-speed check on the live site.

Changelog

2026-10-26
Project page published.
Rollback: Revert the commit that added this page.
2026-10-26
Site launched on Cloudflare Pages. (build log)
Rollback: Roll back to an earlier deployment in the Cloudflare Pages dashboard.