Back to themes

The Navigator

Zero-SSR Astro 7.4 & Tailwind CSS v4 personal engineering theme, Living CV, technical blog, operational log, and smart-flex photo gallery—with an optional multi-region AWS S3 MRAP & CloudFront Terraform stack.


Cost

Free


Created by
edstuurman

The Navigator is an open-source Astro 7.4 and Tailwind CSS v4 static theme designed for engineers, architects, and creators. Out of the box, it delivers a zero-SSR personal site, interactive Living CV, technical blog, unified operational log stream, and aspect-aware photography gallery—engineered so you can customize 100% of your identity, UI behavior, narrative, and media without ever editing an Astro template file.


Zero-Template Customization Architecture


Instead of scattering personal copy across page components, The Navigator separates presentation templates from configuration, Markdown collections, and typed datasets:


  • src/site.config.ts — Site & Author Identity: Single source of truth for your domain, bio metadata, avatar/portrait images, and social profiles, cascading automatically to canonical URLs, Schema.org JSON-LD, sitemaps, RSS/Atom feeds, and /llms.txt endpoints.
  • src/theme.config.ts — UI Mechanics & Feature Toggles: Configure the inline SVG header wordmark, navigation links, pagination sizes, Formspree contact integration, Umami analytics, automatic technical acronym tooltips, Open Graph card branding, and footer toggles (showPoweredBy, showThemeAttribution).
  • src/content/ — Narrative & Markdown Collections: Zod-validated Markdown collections for top-level page copy (src/content/pages/), technical articles (src/content/blog/), status updates (src/content/log/), and photograph backstories (src/content/photography/).
  • src/data/ — Typed Datasets: Pure TypeScript datasets for your career timeline (experiences.ts), peer endorsements (recommendations.ts), and ~60 categorized technical definitions (techTerms.ts).


Core Features Out of the Box


  • Living CV & 4-Collection Tag Taxonomy: Shared topic tags cross-link Career Experience, Technical Articles, Operational Logs, and Photography into unified archive pages (/tags/[tag]/).
  • Rich Build-Time Markdown Pipeline:
  • Inline SVG Mermaid Diagrams: Compiled at build time via rehype-mermaid with zero client-side Mermaid JavaScript bundle.
  • Automatic Technical Acronym Tooltips: Abbreviation tags upgrade at build time into viewport-clamped glassmorphic popover cards with domain badges and keyboard accessibility.
  • Zero-Tracking YouTube Facades: Fenced youtube blocks compile into cached poster thumbnails that load the privacy-enhanced player only on click and promote video posts in /blog/.
  • GitHub-Style Callout Alerts: Semantic NOTE, TIP, IMPORTANT, WARNING, and CAUTION callout blocks.
  • Zero-Dependency Smart-Flex Photo Gallery & Lightbox: Aspect-ratio justified flex grid and accessible dialog-style lightbox with WebP optimization, zoom/fullscreen controls, thumbnail filmstrip, sort-order switching, per-photo attribution, ?photo=ID deep links, and dedicated story pages (/photography/[id]/).
  • Unified /log/ Stream: Dynamically parses root CHANGELOG.md and merges release notes with operational status-updates and photo rolls under filterable category routes.
  • Floating Section Navigation Capsule: Frontmatter-driven section pills (sectionNav) that morph on scroll into a glassmorphic reading capsule with active heading spy, theme toggle, site menu, and back-to-top control.
  • Automated Satori Open Graph Cards & Warm Caching: Generates 1200×630 PNG social cards at /og/*.png with content-addressed SHA-256 disk caching (.cache/og-images/ and .cache/astro/) for ~1.8s warm production builds.


Optional Turnkey Multi-Region AWS Engine (terraform/ + .gitlab-ci.yml)


Deploy the static ./dist/ output to any hosting provider (Cloudflare Pages, Vercel, Netlify, GitHub/GitLab Pages), or pair The Navigator with its included Terraform 1.10+ & GitLab CI/CD infrastructure blueprint:

  • Globally Replicated Private S3 Buckets: Multi-region S3 buckets with Cross-Region Replication (CRR) and native S3 .tflock remote state locking.
  • S3 Multi-Region Access Point (MRAP) + Native CloudFront SigV4a OAC: Zero Lambda@Edge overhead, paired with a sub-millisecond viewer-request CloudFront Function for apex redirects and directory index rewrites.
  • Automated ACM TLS & Route 53 DNS: End-to-end certificate validation and A/AAAA Alias records.
  • MD5/ETag Delta Deployer (scripts/s3-deploy.sh): Uploads only modified build artifacts and issues targeted CloudFront cache invalidations.