Article

Vibe-Coding with Intent: How I Set Up Claude Code for This Site

Most AI coding setups are chaotic. You dump a request in, get code back, and hope it fits. What I built for this site is different — a structured, opinionated workflow where Claude Code acts like a disciplined contractor, not a free-wheeling intern. This post walks through every layer of that setup.

The Instruction Layer: CLAUDE.md

Every Claude Code session reads a file called CLAUDE.md at the root of the project. Think of it as an onboarding document that never gets ignored — and unlike a wiki page, the agent is required to act on it.

Mine covers:

  • Project identity — stack (Next.js, TypeScript, Sanity, Tailwind), repo links, Jira board URL
  • Package manager rules — always bun, never npm or yarn
  • Coding standards — TypeScript strict mode, no magic strings, mobile-first CSS, no inline GROQ
  • File conventions — where queries live, where types live, how components are named
  • The full agent workflow — step by step, from reading a Jira ticket to closing the PR

The key insight is specificity. Vague instructions produce vague results. When the file says “all Sanity queries live in src/sanity/queries.ts as named exports — no exceptions”, Claude follows that rule on every file it touches, every session.

An AI that doesn’t know the rules of your project is just a very fast way to accumulate tech debt.

Code block