Back to Projects

fdrechsler.de

Professional personal website built entirely using AI-assisted development through the AI Development Framework. This project served as the first real-world validation of the framework, demonstrating how coordinated AI agents can deliver production-ready systems efficiently. Built with Next.js 15.x, containerized with Docker, and deployed with automated CI/CD. Features include comprehensive analytics (Umami, Google Analytics 4), dark mode support, SEO optimizations with JSON-LD structured data, and full German legal compliance. The project progressed from initial setup to a fully deployed production website through a structured workflow of research, implementation, testing, and review phases, with human oversight at critical checkpoints. Key achievements include comprehensive documentation (ADRs, deployment guides), infrastructure as code, and successful framework bug discovery and resolution.

Active
Next.jsTypeScriptDockerCI/CDProduction
Project Timeline

Start Date

October 24, 2024

End Date

Ongoing

Duration

2+ months

Key Metrics

Tickets Created

47

Tickets Completed

34

AI Sessions

18

Development Journey
Technical Stack
Next.js 15React 19TypeScriptTailwind CSSDockerGitHub ActionsUmami AnalyticsGoogle Analytics 4Self-Hosted (Netcup VPS)
Achievements
  • ✅ Production deployment completed (2024-11-08)
  • ✅ Full CI/CD pipeline with automated deployment
  • ✅ Docker-based infrastructure on self-hosted VPS
  • ✅ Modern responsive design with dark mode support
  • ✅ Comprehensive analytics (Umami + GA4) with public dashboard
  • ✅ SEO optimization with JSON-LD structured data
  • ✅ German legal compliance (Impressum & Datenschutz)
  • ✅ SSL encryption with Let's Encrypt
  • ✅ WCAG 2.2 AA accessibility compliance
  • ✅ Optimized Core Web Vitals (LCP, INP, CLS)
  • ✅ Security hardening (Docker + CI/CD scanning)
  • ✅ FAQ sections with FAQPage schema
  • ✅ Successfully validated AI Development Framework in production
Repository Information

This project follows a multi-repository architecture with specialized repositories for different concerns.

Meta Repository

Private Repository

Private

Frontend

Private Repository

Private

Backend

Private Repository

Private

Infrastructure

Private Repository

Private

AI Conversations

Private Repository

Private