About

About This Site

This portfolio is intentionally over-engineered. It's a working demonstration of production-grade practices applied to a static site.

Stack

• Framework: Astro 5 - Islands architecture, zero JS by default
• UI: React 19, TypeScript (strict mode), Tailwind CSS 4
• Deployment: Cloudflare Pages (main site), GitHub Pages (architecture docs)
• Source: github.com/chrislyons-dev/home

CI/CD Pipeline

Every push triggers a full quality gate:

1. Change detection - Skip deployment for docs-only changes (grep filter for ^(docs/|.*\.md$))
2. Commit validation - Conventional commits enforced via commitlint
3. Code quality - Prettier format check, ESLint (TypeScript strict), type check (tsc --noEmit)
4. Tests - Vitest with coverage tracking (V8 provider)
5. Build - Astro production build with Lightning CSS minification
6. Lighthouse CI - 3 runs - 5 pages, scores 95 required (Performance, Accessibility, Best Practices, SEO)
7. Performance tracking - Lighthouse scores auto-committed to docs/performance.md

Deployment requires: [ok] All checks pass, [ok] Concurrency control (no simultaneous deploys), [ok] CSP hash generation, [ok] Docs validation

Security

• Content Security Policy: Build-time script hashing - scan built HTML for inline scripts, generate SHA-256 hashes, inject into _headers. No unsafe-inline, no nonces.
• HTTP Security Headers: X-Frame-Options: DENY, X-Content-Type-Options: nosniff, Strict-Transport-Security, Referrer-Policy
• No tracking: Zero analytics, zero cookies, zero third-party scripts
• Dependency scanning: npm audit on every CI run, Dependabot for automated updates

Architecture as Code

• Auto-generated diagrams: C4 system context, container, and component diagrams - PlantUML generated from source on every commit
• Dependency graphs: Module relationships visualized with Mermaid, circular dependency detection enforced
• Route maps: File-based routing structure auto-documented from src/pages/
• Docs publishing: MkDocs site built and deployed to GitHub Pages on every PR to main

Performance

• Island architecture: Zero JS shipped by default, selective hydration (client:idle, client:visible)
• Static generation: No runtime server, pages pre-rendered at build time
• View Transitions API: Smooth page navigation without SPA overhead
• Edge CDN: Cloudflare Pages global distribution, immutable caching for assets (1 year), short cache for HTML (5 min + stale-while-revalidate)
• Current scores: All pages maintain Lighthouse scores >=95 across all metrics

Pre-Commit Hooks

Husky enforces quality gates before every commit:

1. Format check (Prettier)
2. Lint (ESLint)
3. Type check (tsc)
4. Tests (Vitest)
5. Architecture docs generation
6. Dependency analysis (circular deps, orphans)