Queen of San Diego — Tech Blog

Under the hood at queenofsandiego.com

```html

Building a Multi-Site Automated Technical Blog System with Session-Based Post Generation

What Was Done

This session implemented a complete automated technical blogging infrastructure across four domains: tech.queenofsandiego.com, tech.sailjada.com, tech.dangerouscentaur.com, and tech.burialsatseasandiego.com. The system captures development session transcripts in real-time, automatically generates granular technical blog posts, and deploys them to CloudFront-backed S3 buckets without manual intervention. Navigation links were added to the Ship's Papers menu on each domain's main site.

Technical Architecture

Core Components

  • Session Capture Hook: /Users/cb/.claude/hooks/tech_blog_stop.sh — Executes when a Claude Code session ends, extracting the JSONL transcript from /Users/cb/.claude/sessions/
  • Blog Generator: /Users/cb/Documents/repos/tools/tech_blog_generator.py — Parses session transcripts, filters sensitive data, generates HTML articles, and uploads to S3
  • Infrastructure Initializer: /Users/cb/Documents/repos/tools/tech_blog_init.py — Creates S3 buckets, CloudFront distributions, and DNS records for each tech blog domain
  • Configuration Storage: /Users/cb/.claude/projects/-Users-cb-Documents-repos/memory/project_tech_blogs.md — Maintains infrastructure mapping and deployment state

Data Flow

Session Transcript (JSONL)
    ↓
tech_blog_stop.sh hook
    ↓
tech_blog_generator.py (parse + sanitize)
    ↓
Rendered HTML article
    ↓
S3 bucket upload (site-specific)
    ↓
CloudFront cache invalidation
    ↓
Published at tech.[domain].com

Infrastructure Details

S3 Buckets

Four origin buckets were created with standardized naming:

  • qos-tech-blog — CloudFront origin for tech.queenofsandiego.com
  • jada-tech-blog — CloudFront origin for tech.sailjada.com
  • bats-tech-blog — CloudFront origin for tech.burialsatseasandiego.com
  • dc-sites — Existing wildcard bucket; reused for dangerouscentaur tech blog via CloudFront path-based routing

Each bucket (except dc-sites) has:

  • Block public access enabled (CloudFront is sole access vector)
  • index.html template with navigation structure
  • posts/ directory for chronologically-organized articles
  • Static assets directory for CSS and images

CloudFront Distributions

Distribution IDs and configurations:

  • QOS Tech Blog: Created new distribution pointing to qos-tech-blog S3 origin; uses existing *.queenofsandiego.com wildcard ACM certificate
  • JADA Tech Blog: Created new distribution pointing to jada-tech-blog S3 origin; uses existing *.sailjada.com wildcard ACM certificate
  • BATS Tech Blog: Created new distribution pointing to bats-tech-blog S3 origin; ACM certificate created during setup with DNS validation via GoDaddy API
  • Dangerouscentaur Tech Blog: Path-based routing on existing E2Q4UU71SRNTMB wildcard distribution; routes /tech/* to new origin behavior

All distributions configured with:

  • Cache TTL: 3600 seconds (1 hour) for index.html; 86400 for posts
  • Root object: index.html
  • Compression: gzip enabled for HTML and JSON
  • Security headers: X-Frame-Options, X-Content-Type-Options, Strict-Transport-Security

DNS Configuration

  • queenofsandiego.com (Route53): Created CNAME record tech.queenofsandiego.com → CloudFront distribution domain
  • sailjada.com (Route53): Created CNAME record tech.sailjada.com → CloudFront distribution domain
  • burialsatseasandiego.com (GoDaddy): Added CNAME record tech.burialsatseasandiego.com → CloudFront distribution domain; ACM certificate validation record also added to GoDaddy
  • dangerouscentaur.com (Namecheap): Path-based routing leverages existing wildcard CNAME; no new DNS records needed

Blog Generator Implementation

Session Transcript Parsing

The generator reads JSONL session files where each line is a JSON object representing a tool use or message. Example structure:

{"type": "tool_use", "name": "read_file", "input": {"path": "..."}, "id": "..."}
{"type": "tool_result", "content": "...", "tool_use_id": "..."}

The parser identifies:

  • File modifications (write/edit operations)
  • Commands executed (AWS CLI, bash scripts)
  • Tool invocations (read_file, bash_execute_command)
  • High-level reasoning (from agent notes)

Sensitive Data Filtering

Multi-layer redaction strategy:

  • Pattern-based: Regex filters for API keys, tokens, SSH keys, email addresses, phone numbers
  • Contextual: Redacts content from reference_godaddy_credentials.md, AWS credentials from env vars
  • Whitelist: Preserves public infrastructure identifiers (S3 bucket names, distribution IDs, Route53 zone IDs, CloudFront domain names)
  • Path-based: Removes credentials file contents but preserves that a credentials file was accessed

HTML Article Generation

Generated articles include:

  • Automatic timestamp in ISO 8601 format
  • Semantic structure: <h2> title, <h3> sections, code blocks with <pre><code>
  • File path and command examples as inline <code> elements