claudefan.dev

Practical guides for developers building with AI

Angular 8 to Angular 21 migration orchestrated by Claude Fable 5
Aug 5
14 Majors in Two Days: Migrating a 150K-Line Angular 8 App to Angular 21 with Claude Fable 5

How Claude Fable 5 orchestrated Opus and Sonnet sub-agents through a direct Angular 8 to 21 migration of a production golf club management platform — planning artifacts, closed-loop Playwright verification, and a gotcha catalog for anyone attempting the same.

Case studies
neuscreen screen recorder capturing DOM selectors, console errors and network calls alongside video
Aug 5
neuscreen: A Screen Recorder Built for AI Agents, Not Just Humans

Loom and its peers were designed for an audience that was always a person. Half of my recordings' audience is now Claude Code. Why I built an AI-first screen recorder, what a context manifest actually captures, and why the source is public.

Announcements
Setting up n8n with Render and Supabase
Mar 4
How to Setup n8n Self-Hosted Instance for FREE using Render and Supabase

A complete guide to deploying a free, self-hosted n8n workflow automation instance using Render and Supabase PostgreSQL.

Guides
Building claudefan.dev with Claude
Dec 20
How I Used Claude to Build claudefan.dev

A deep dive into building a modern tech blog using Claude AI as my pair programming partner. From architecture decisions to deployment — here's how AI-assisted development actually works.

Case studies
Generating Claude-style cover images with Gemini
Dec 19
How I Used Gemini's Nano Banana to Generate Claude-Style Cover Images

A step-by-step guide to reverse-engineering Claude's hand-drawn illustration style using Gemini's Nano Banana'. Includes reusable prompt templates.

Tutorials
claudefan.dev: Why I've created this website
Dec 17
Welcome to claudefan.dev: Why I've created this website

Documenting my journey as a developer working with Claude and other AI Models. This website is for builders who want to be an AI First developers.

Announcements