Highlights • In Production
DealerClick.com: An Astro Islands Marketing Site
The marketing site for an automotive DMS platform, built to be fast by default and easy to find. It uses Astro 5’s islands architecture: the pages render as static HTML and only the genuinely interactive components — the header and top bar — ship as React islands and hydrate on the client. Everything else stays zero-JS.
Stack
Astro 5 · React 19 (via @astrojs/react, used only for islands) · TypeScript ·
Tailwind CSS v4 with an @theme directive (oklch color space, dark mode via a
.dark class) · @astrojs/sitemap · compressHTML enabled.
What it does well
- Islands, not a SPA —
HeaderIsland/TopBarIslandhydrate; the rest is static, so the JavaScript footprint stays small. - SEO baked in — OpenGraph and Twitter cards, JSON-LD structured data
(
BlogPosting, product schema), canonical URLs, and an auto-generated sitemap. - Theme system — CSS custom properties in oklch with first-class dark mode,
configured via Tailwind v4’s
@themerather than a JS config. - Content structure — product, pricing, and blog pages organized as Astro routes.
The project’s README reports a typical Lighthouse score of 95+, all-green Core Web Vitals, an SEO score of 100 (with proper content), and WCAG 2.1 AA accessibility — the kind of numbers the islands-first approach is designed to hit.