AI Development
8 Nov 2026
14 min read

AI Agent Development: How SpaceZero Enables Autonomous App Building

How the SpaceZero template is designed for AI agents to autonomously build micro-apps from seed specifications.

AI Agent Development with SpaceZero

SpaceZero is built from the ground up for AI agent consumption.

The Seed Specification

docs/seed.md is the contract between human and AI:

markdown

# App Name — Seed Specification

 

## 1. Product Decision & Core Value Proposition

- **Application Name**: SchemaCraft

- **One-Line Pitch**: Generate valid JSON-LD for any webpage

- **Target Domain**: SEO / Structured Data

- **Core Promise**: URL → Fetch → Generate JSON-LD → Download

 

## 2. Target Customers & Beachhead

- **Primary**: Freelance SEOs

- **Secondary**: Agencies, indie hackers

 

## 3. Product Workflow

sequenceDiagram User->>Frontend: Enter URL Frontend->>Edge: Dispatch Request Edge->>Edge: Execute Logic Edge->>Frontend: Return Results

code

 

## 4. Core Features (3-5)

1. Fetch URL, extract existing JSON-LD

2. Validate against Schema.org

3. Generate corrected JSON-LD

4. Download as .json or copy

 

## 5. Differentiation

1. Observable Evidence

2. Direct Remediation

3. Time-to-Value < 60s

 

## 6. Pricing

- Free: 3 generations/day

- Lifetime:

0 (Gumroad: schemacraft-pass)

 

## 7. Database Tables

- schemacraft_generations (user_id, url, results, created_at)

 

## 8. Branding

- Primary: #8b5cf6 (Violet)

- Font: Geist + JetBrains Mono

- Tone: Technical, minimalist

 

## 9. Landing Copy

- Hero: "Stop Guessing Schema. Generate Valid JSON-LD Instantly."

- CTA: "Generate Free Schema"

AI Agent Instructions

docs/agents.md tells the agent how to work:

  • Read seed.md first
  • Use existing components only
  • Follow design constraints
  • Run quality gates before committing

Constraints That Help Agents

1. Design System Constraints

typescript

// tailwind.config.js - only these values work

spacing: { 0, 1, 2, 3, 5, lg, 7xl, full }

fontSize: { hero, title, base, small }

Agent can't use p-4 — it doesn't exist. Forces correct usage.

2. Component Architecture

tsx

// Pages compose, don't style

<PageLayout>

<PageMain>

<Card>

<CardTitle><Icon name="Server" /><span>Feature</span></CardTitle>

<CardContent>Description</CardContent>

</Card>

</PageMain>

</PageLayout>

3. File Structure Conventions

code

src/components/ui/ // Reusable components

src/contexts/ // React contexts (Fast Refresh boundary)

src/components/infra/ // ErrorBoundary, ProtectedRoute

src/pages/ // Page compositions

src/hooks/ // Custom hooks

src/lib/ // Utilities + data

src/app.ts // App configuration

functions/api/ // Edge functions

4. Quality Gates

bash

npm run typecheck && npm run lint && npm run build && npm run test

Agent must pass all before "done".

Agent Workflow

  1. Read seed.md and agents.md
  2. Configure src/app.ts, vite.config.ts, index.html
  3. Build domain logic in functions/api/
  4. Compose UI in src/pages/Home.tsx
  5. Migrate database in supabase/migrations/
  6. Verify all quality gates pass
  7. Document changes in docs/

Benefits

  • Consistent Output: Constraints prevent drift
  • Faster Iteration: Agent knows exactly where things go
  • Maintainable Code: Follows established patterns
  • Production Ready: Quality gates catch issues early