Technical Summary mark-hazleton-s-notes is a full-stack personal portfolio and blog site built with React 19 and TypeScript, designed to showcase Mark Hazleton's work as a Technical Solutions Architect. The site delivers long-form content on cloud architecture and engineering practices, a project portfolio with live GitHub repository metrics, dynamic video galleries sourced from YouTube, and comprehensive SEO assets—all statically prerendered at build time and deployed to Azure Static Web Apps. The architecture employs a sophisticated content pipeline combining Markdown-based blog posts with generated metadata artifacts (articles.json, projects.json), dynamic repository statistics fetched from an external JSON feed during prerendering, and build-time image optimization that generates WebP variants and RSS-optimized thumbnails. The tech stack leverages Vite 7 with SSR and static prerendering capabilities, Tailwind CSS with shadcn/ui and Radix UI components, React Router for client-side navigation, and a comprehensive set of build scripts (written in TypeScript and Node.js) that orchestrate metadata generation, image processing, sitemap/RSS feed creation, and repository data synchronization. Notable architectural patterns include separation of content sources from rendering logic, build-time data fetching with client-side fallbacks for development, canonical URL and Open Graph management through a dedicated SEO component, and a well-documented developer experience with structured project constitution and governance docs in .documentation/. The repository demonstrates production-grade practices such as type-safe data adapters, automated image optimization pipelines, video sitemap generation, and CI/CD integration, making it a reference implementation for modern JAMstack personal sites and technical portfolios that blend dynamic content with static deployment efficiency.