Skip to content
tutorial

Why Wumty Works So Well with Claude Code, Cursor, and Copilot

March 13, 2026 By Wumty Team
Why Wumty Works So Well with Claude Code, Cursor, and Copilot

AI coding tools are changing how developers build websites. Claude Code, Cursor, GitHub Copilot, and Windsurf can read your codebase, suggest edits, and generate new features - but only if the codebase is structured in a way they can understand.

Most website templates fail here. Untyped frontmatter, inconsistent file naming, deeply nested configs, and magic conventions mean AI assistants spend more time guessing than helping. You end up correcting the AI more than it helps you.

Wumty is different. The architecture was designed around the same principles that make codebases AI-friendly: typed schemas, predictable file conventions, and centralized configuration. Here’s why that matters.

Typed Schemas with Zod

Every content type in Wumty - pages, blog posts, services, products, FAQ items, sections - is defined with a Zod schema. When Claude Code or Cursor reads your project, it knows exactly what fields exist, what types they expect, and which are optional.

// AI tools can read this schema and know exactly what a service page needs
export const servicesCollection = defineCollection({
  schema: z.object({
    title: z.string(),
    description: z.string(),
    hero: heroSectionSchema,
    about: aboutBlockSchema.optional(),
    faqs: faqSectionSchema.optional(),
  }),
});

Ask Claude Code to “add a new service page for web design” and it generates correct frontmatter on the first try - because the schema tells it exactly what’s required. No guessing, no hallucinated field names.

Compare this to untyped templates where frontmatter is implicit. AI tools have to infer field names from examples across multiple files, leading to inconsistencies and build errors.

Predictable File Conventions

Wumty follows a strict, consistent file structure:

src/
├── config/          # All site config in JSON files
│   ├── site.json    # Name, URL, logo
│   ├── seo.json     # Business info, structured data
│   ├── theme.json   # Colors, fonts, spacing
│   └── menu.json    # Navigation links
├── content/         # All content as Markdown
│   ├── blog/        # Blog posts
│   ├── services/    # Service pages
│   ├── solutions/   # Industry pages
│   └── sections/    # Homepage sections
├── pages/           # Astro page routes
└── types/           # Zod collection schemas

Every directory has a single responsibility. Config is config, content is content, types are types. AI tools can navigate this structure reliably because there’s no ambiguity about where things live.

When you tell Cursor “change the primary color to blue,” it knows to look in theme.json. When you ask Copilot to “add a new blog post about SEO,” it knows to create a file in src/content/blog/ matching the blog collection schema.

Centralized JSON Configuration

Site-wide settings live in focused JSON files, not scattered across components or environment variables:

// src/config/site.json - AI tools can read and modify this directly
{
  "title": "My Business",
  "base_url": "https://mybusiness.com",
  "siteName": "My Business",
  "logo": "/images/logo.svg"
}

JSON is the most universally understood format by AI coding tools. Every LLM has been trained extensively on JSON. When your configuration is JSON rather than JavaScript objects, TypeScript constants, or YAML mixed with code, AI assistants edit it accurately and consistently.

Content Collections as a Contract

Astro Content Collections act as a contract between your content and your templates. AI tools can read this contract and understand:

  1. What content types exist (blog, services, products, solutions)
  2. What fields each type requires (title, description, hero, etc.)
  3. What the validation rules are (string, number, date, optional)
  4. How content relates to pages (collection → route mapping)

This contract means AI-generated content passes validation on the first build. No iteration cycle of “generate → build → fix → rebuild.”

How Each AI Tool Benefits

Claude Code

Claude Code reads your entire project context. With Wumty’s clean structure, it can:

  • Generate new pages with correct schemas
  • Modify theme tokens across the design system
  • Add new content collection types with proper Zod schemas
  • Update SEO config, navigation, and structured data
  • Understand the monorepo architecture for multi-site work

Cursor

Cursor’s inline editing works best with well-typed code. Wumty’s TypeScript throughout and Zod schemas give Cursor the type information it needs to suggest accurate completions and refactors.

GitHub Copilot

Copilot excels at pattern completion. Wumty’s consistent file structure means once Copilot sees one service page, it can generate additional service pages that match the exact same pattern - correct frontmatter, proper section structure, valid content.

Windsurf

Windsurf’s Cascade feature benefits from codebases with clear boundaries. Wumty’s separation of config, content, types, and pages lets Windsurf make targeted changes without unintended side effects.

What Makes a Template AI-Unfriendly

For contrast, here’s what breaks AI coding tools in typical templates:

  • Untyped frontmatter - AI guesses field names and gets them wrong
  • Config in code - Settings buried in component props instead of config files
  • Inconsistent naming - blog-post.md in one directory, blogPost.md in another
  • Magic strings - Component behavior controlled by undocumented string values
  • Deep nesting - Config objects 5 levels deep that AI tools truncate or misread
  • Mixed concerns - Layout, data fetching, and business logic in the same file

Wumty avoids all of these by design.

Try It Yourself

Clone the free Starter Kit and open it in Claude Code, Cursor, or your preferred AI tool. Ask it to:

  1. Change the site name and colors
  2. Add a new blog post
  3. Create a new page with a hero section
  4. Modify the navigation menu

You’ll see the difference immediately - AI assistants work with Wumty’s structure instead of fighting it.

For production sites, the Single Site adds content collections with full Zod schemas, and the Agency Kit extends this to a multi-site monorepo. Compare all options on the pricing page.


Try it with your favorite AI coding tool. The free Starter Kit is structured for Claude Code, Cursor, and Copilot from day one. See how the kits compare on the pricing page.

Tags: tutorial
Share:

Ready to build your next agency site?

Start free with the Starter Kit, or get the full system with Single Site, Studio, or Agency.

Get Started Solutions