Under the hood
How It Works
agent101.nl is simultaneously the product and the case study. Every page presents agentic AI content and demonstrates the principles keeping this site alive. Explore the protocols it speaks, the agents that run it, and the architecture patterns behind them.
Interactive diagram
The Agent Pipeline
The full agent pipeline: from external sources through discovery, curation, and PR creation to deployment. Click any node for details about its role and data flows.
Agent Heartbeat
Live Agent Dashboard
Status cards are populated from Supabase events and sync with GitHub PR history as the pipeline evolves. Each metric is self-explaining and auditable by design.
ContentScout
Role-based scheduled runner
- Last run
- 4d ago
- Status
- Success
VideoHunter
Role-based scheduled runner
- Last run
- 4d ago
- Status
- Success
QualityGuard
Role-based scheduled runner
- Last run
- —
- Status
- —
ContentDoctor
Role-based scheduled runner
- Last run
- 2d ago
- Status
- Success
ContentWriter
Role-based scheduled runner
- Last run
- —
- Status
- —
SEOOptimizer
Role-based scheduled runner
- Last run
- 2d ago
- Status
- Success
DependencyBot
Role-based scheduled runner
- Last run
- 2d ago
- Status
- Success
SiteBuilder
Role-based scheduled runner
- Last run
- —
- Status
- —
This section is curated by VideoHunter. See how the agents work in the architecture page.
PR activity
GitHub PR Feed
Recent pull requests authored by agents. Each card includes the PR authoring agent name and status.
No pull requests found. Check back after the first agent run.
PR feed is managed by QualityGuard and displayed on every page from the shared header ticker.
Cost transparency
What it costs to run
- Vercel Hobby (free)
- Sanity free CMS tier
- Supabase free database + activity logs
- Anthropic API (agent executions): ~€10–25/mo
Live spend and monthly breakdown will be populated from a real-time spreadsheet widget or Supabase-backed usage counters.
Build story
Timeline: from bootstrap to autonomous
- Stage 1
Foundation
Scaffolded Next.js + Tailwind, built design system, set up Sanity + Supabase.
- Stage 2
Content pages
Created content pages (Protocols, Agents, Resources, Tutorials), seeded content.
- Stage 3
Hub & deploy
Complete How It Works hub, cross-reference hooks, deploy initial production.
- Stage 4
Agents live
Activate agents in GitHub Actions (ContentScout, QualityGuard, VideoHunter, etc.).
Code walkthrough
Key files and why they matter
CLAUDE.md
Project constitution and conventions
CLAUDE.md
Sanity schemas
Content data shapes and attribution ACL
sanity/schemaTypes
Agent workflows
Cron + issue triggers for agent execution
.github/workflows
How It Works page
Self-explanatory site control plane
src/app/how-it-works/page.tsx
FAQ
Common questions from curious builders
Every section of this page is intentionally written to be a self-referential “living doc” that reveals the same agentic system it describes.