Queen of San Diego — Tech Blog

Under the hood at queenofsandiego.com

```html

Building an Automated Technical Blog System Across Four Domains with Claude Code Hooks and AWS Infrastructure

What Was Done

This session built a complete automated technical documentation system that captures granular session details and publishes them as blog posts across four domains: tech.queenofsandiego.com, tech.sailjada.com, tech.dangerouscentaur.com, and tech.burialsatseasandiego.com. The system automatically generates posts from Claude Code session transcripts, filters sensitive data, and deploys them to S3/CloudFront infrastructure without manual intervention.

Core Components Built

1. The Stop Hook System

Created /Users/cb/.claude/hooks/tech_blog_stop.sh, a Claude Code stop hook that executes when a development session ends. This hook:

  • Reads the session transcript in JSONL format from Claude's internal session storage
  • Extracts all file modifications and command execution history
  • Invokes the blog generator with the transcript data and detected domain context
  • Publishes the generated post to the appropriate S3 bucket and invalidates CloudFront cache
  • Logs all operations to ~/.claude/logs/tech_blog_generation.log

The hook is registered in ~/.claude/settings.json under the onSessionStop configuration, ensuring it runs for every session without requiring manual trigger.

2. Tech Blog Generator

Built /Users/cb/Documents/repos/tools/tech_blog_generator.py, a Python script that:

  • Parses Claude session transcripts (JSONL format with tool_use entries)
  • Extracts relevant file paths, AWS resources, DNS changes, and command outputs
  • Identifies which domain(s) the session modified using path-to-domain mapping
  • Generates HTML blog posts with semantic structure (h2, h3, ul, li, code blocks)
  • Scrubs all credentials, API keys, tokens, passwords, and sensitive data using regex patterns
  • Timestamps posts with ISO 8601 format and generates URL-safe slugs
  • Returns structured JSON with post content, domain targets, and metadata

The generator uses a domain detection map that associates file paths with target domains:

{
  "queenofsandiego.com": ["/queenofsandiego.com/", "/jada_blast.py"],
  "sailjada.com": ["/sailjada.com/", "/jada_blast.py"],
  "dangerouscentaur.com": ["/dangerouscentaur.com/", "/dc-"],
  "burialsatseasandiego.com": ["/burialsatseasandiego.com/", "/bats"]
}

3. Infrastructure Initialization

Created /Users/cb/Documents/repos/tools/tech_blog_init.py to establish S3, CloudFront, and DNS infrastructure for each tech blog domain. The script:

  • Creates S3 buckets: tech-queenofsandiego-com, tech-sailjada-com, tech-burialsatseasandiego-com, and reuses existing dc-sites bucket for dangerouscentaur
  • Configures static website hosting with index.html as the default document
  • Creates CloudFront distributions with wildcard ACM certificates
  • Adds DNS records (CNAME for Namecheap/GoDaddy, A records for Route53)
  • Implements cache invalidation patterns for automatic updates
  • Verifies certificate validation (ACM DNS challenges) and adds records to appropriate DNS providers

Infrastructure mappings:

queenofsandiego.com (Route53):
  - S3: tech-queenofsandiego-com
  - CF Distribution: E2Q4UU71SRNTMB (shared wildcard cert)
  - Certificate: *.queenofsandiego.com (existing)

sailjada.com (Route53):
  - S3: tech-sailjada-com
  - CF Distribution: (new distribution)
  - Certificate: *.sailjada.com (existing)

dangerouscentaur.com (Namecheap):
  - S3: dc-sites (existing)
  - CF Distribution: E2Q4UU71SRNTMB (wildcard)
  - CNAME: tech.dangerouscentaur.com

burialsatseasandiego.com (GoDaddy):
  - S3: tech-burialsatseasandiego-com
  - CF Distribution: (new distribution)
  - GoDaddy API: Auto-adds DNS records via credentials

Technical Architecture

Session Capture Flow

  1. Developer completes work in Claude Code IDE
  2. Session ends; onSessionStop hook fires automatically
  3. Hook reads raw transcript from ~/.claude/projects/[project-path]/sessions/
  4. Transcript contains tool_use JSON entries with all modifications and outputs
  5. Generator parses, extracts, sanitizes, and renders to HTML
  6. Publishes to S3 and invalidates CloudFront (TTL ~1 minute for tech blogs)
  7. Posts appear at tech.[domain]/posts/[YYYY-MM-DD]/[slug].html

Credential Scrubbing Strategy

The generator uses multi-stage regex filtering:

- AWS credentials: pattern matching AccessKey, SecretKey formats
- API keys: GoDaddy, Namecheap, GA4 key patterns
- Passwords: common password/token patterns
- Email addresses: limited PII (redacted except public contact emails)
- Phone numbers: full redaction
- ARNs with sensitive data: preserves resource names, redacts account IDs where appropriate

Navigation Integration

Updated /Users/cb/Documents/repos/sites/queenofsandiego.com/index.html to add a "Ship's Papers" dropdown menu that includes a "Technical Blog" link pointing to https://tech.queenofsandiego.com/. This pattern is replicated across all four site structures, making technical documentation discoverable from each domain's main navigation without cluttering primary site content.

Why This Architecture

  • Automation: Stop hooks run without manual intervention—no post-session ritual required
  • Granularity: Captures every file change, command, and output, not summaries
  • Security: Multi-layer credential scrubbing prevents accidental exposure
  • Scalability: Single generator handles four domains via domain detection map
  • Cost: S3 static sites + CloudFront is minimal; fits within existing AWS footprint
  • Observability: Sergio and other team members can audit exactly what was changed, when, and why
  • Infrastructure as Code: Python scripts make infrastructure repeatable and version-controlled

Key Decisions

  • Stop Hook vs. Scheduled Job: Stop hooks are synchronous,