by Belkins
Vlad's Playbook — the operator's field manual where every artifact is live, clickable, and forwardable. 39 chapters · 25 interactive widgets · 3 embedded case studies (AFC pitch + sanitized client audit). Read it → dive.vladyslavpodoliako.com
# Add to your Claude Code skills
git clone https://github.com/Belkins/ai-dive-deepA 39-chapter operator field manual where every artifact is live, clickable, and forwardable.
Stop sending dead files. Every report, pitch, audit, deck, and analysis ships as a live interactive HTML artifact on a deployed link — not a PDF attachment that started rotting the second it was exported. The link is current because the repo is. People forward links; they archive PDFs unread.
This repo is the proof. The book about building this kind of artifact is, itself, this kind of artifact — a private GitHub repo deployed to a public link, updated by commit, with two real interactive case studies embedded and clickable inside it.
→ Read the thesis + click the embeds: dive.vladyslavpodoliako.com/html-first
The repo is how it's built. The site is what it IS.
| Surface | What's there | Live link | |---|---|---| | All 39 chapters | The whole book, MDX-rendered, with TL;DRs, glossary tooltips, code blocks, and the receipts behind every claim | | | | The flagship — thesis + 3 embedded live artifacts (AFC pitch deck, AFC robot stable, sanitized client deliverability audit) | | | | Every tool ranked without diplomatic phrasing, plus the live LMArena leaderboard widget | | | | 16 reference sections — slash commands, settings keys, hook JSON shape, permission syntax, model routing — printable | | | | 52 terms, A–Z, linked inline throughout the chapters | | | | Copy-paste templates: CLAUDE.md skeletons, .mcp.json, hooks, SKILL.md, subagent .md, Docker sandbox + devcontainer, 18 reusable prompts | | | | 9 external signals that shift what to do Monday — sourced, dated, signal-vs-receipt discipline | | | | Karpathy's 4 + 8 operator additions, with a receipt per rule | | | | 600-word defense memo. Defend the spend. | | | | Custom roadmap with markdown + .ics export | |
No comments yet. Be the first to share your thoughts!
/chaptersPress ⌘K anywhere on the site — search every chapter, page, section anchor, glossary term, and research note from one box.
The HTML-ization page doesn't describe the method — it shows it, with three real artifacts the operator-Claude workflow produced:
src/content/chapters/*.mdxsrc/widgets/ (live LMArena leaderboard, sortable tier list, command palette, token-burn calculator, swarm visualizer, persona-agent walkthrough, …)src/pages/ (the surfaces in the table above + the journey, sections index, showcase, vault starter, weekend builds, and more)src/lib/glossary.tssrc/lib/research-notes.tspublic/artifacts/ — single-file, self-contained, sandboxed-iframe-embedded on /html-firstsrc/lib/snippets.tsThe auto-updated LMArena leaderboard widget pulls live from the HuggingFace datasets-server API — the rest of the site is static HTML.
astro build). Server components by
default; React 18 islands only where interaction needs them.<Callout>, <PullQuote>, <TLDR>, <ScreenshotPlaceholder>,
<GlossaryTooltip>).--accent: #FF6B2C, --paper, --line, etc.)..github/workflows/deploy.yml — push to
main, live in ~90 seconds at dive.vladyslavpodoliako.com.npm install
npm run dev # http://localhost:4321
npm run build # static output → dist/
npm run preview # serve dist/ locally
Requires Node 20+.
src/content/chapters/ matching the schema in
src/content/config.ts.src/lib/chapters.ts.src/pages/chapters/[slug].astro picks it up.To add a whole new page (resources, /tier-list-style surface, etc.), the
six wiring surfaces are codified in the
playbook-new-page skill: page
file · ⌘K index · chapter cross-link · glossary term · homepage tile ·
changelog.
Written and built by Vlad Podoliako — Founder & CEO of Belkins, founder of Folderly, and operator across a portfolio of others.
The book teaches the technique. The artifact IS the technique. The repo is how it's built — but the site is what it IS.
See LICENSE.