AI Workflows

Using Grit with Claude

Build entire full-stack applications using AI spec-driven development. Plan with Claude Web, build with Claude Code — ship in hours, not weeks.

The Workflow

The Grit + Claude workflow is a 3-step process that turns a project idea into a fully scaffolded, working application. You use Claude Web (claude.ai) to plan and generate spec files, then hand those specs to Claude Code (the CLI agent) to execute every command and build the entire project automatically.

1

Plan

Open claude.ai and describe your project. Ask Claude to generate 3 spec files.

2

Spec

Claude outputs 3 files: project-description.md, claude-code-prompt.md, and project-phases.md.

3

Build

Feed the specs to Claude Code. It runs every grit command, generates resources, and builds the app.

Why two Claudes? Claude Web excels at creative planning and writing detailed specifications. Claude Code excels at executing commands, editing files, and building working software. Together, they cover the full spectrum from idea to deployed application.

Step 1: Planning with Claude Web

Open claude.ai and describe your project idea in detail. The more specific you are about your models, fields, relationships, user roles, and features, the better the output will be. Tell Claude about Grit so it generates specs that use the correct CLI commands and field types.

Here is the exact prompt template you can paste into Claude Web. Replace the bracketed sections with your own project details:

Prompt template for Claude Web
I want to build a [PROJECT NAME] using the Grit framework.

Grit is a full-stack meta-framework that uses:
- Go backend (Gin web framework + GORM ORM)
- Next.js frontend (React + App Router + TypeScript)
- Admin panel (resource-based, Filament-like)
- Monorepo with shared types and validation (Zod)
- Docker for infrastructure (PostgreSQL, Redis, MinIO)

Here's what I want to build:
[DESCRIBE YOUR PROJECT IN DETAIL]

Please create these 3 files for me:

1. project-description.md — Full project spec with all models, their
   fields (use Grit field types: string, text, int, uint, float, bool,
   datetime, date, slug, belongs_to, many_to_many), relationships,
   user roles, and features.

2. claude-code-prompt.md — Step-by-step instructions that I'll give
   to Claude Code (AI coding agent). Include exact grit CLI commands
   to run in order. Use `grit generate resource <Name> --fields "..."`
   syntax.

3. project-phases.md — A phased build plan with checkboxes. Phase 1:
   scaffold + core models. Phase 2: relationships + complex features.
   Phase 3: frontend customization + polish.

Example: Job Board Application

Here is what a filled-in prompt looks like for a Job Board app:

Example prompt for a Job Board
I want to build a Job Board using the Grit framework.

Grit is a full-stack meta-framework that uses:
- Go backend (Gin web framework + GORM ORM)
- Next.js frontend (React + App Router + TypeScript)
- Admin panel (resource-based, Filament-like)
- Monorepo with shared types and validation (Zod)
- Docker for infrastructure (PostgreSQL, Redis, MinIO)

Here's what I want to build:
A job board where companies can post job listings and
candidates can browse and apply. Companies have profiles
with a name, logo, website, and description. Jobs have a
title, description, location, salary range (min and max),
job type (full-time, part-time, contract, remote), and
a category. Applications track which user applied to which
job, with a cover letter and resume URL. There should be
an admin panel for managing all resources, and a public
frontend for browsing published jobs.

User roles: ADMIN (manages everything), EMPLOYER (posts
jobs for their company), USER (browses and applies).

Please create these 3 files for me:

1. project-description.md
2. claude-code-prompt.md
3. project-phases.md

Claude Web will respond with all 3 files, fully detailed and ready to use. Copy each file into your project directory before moving to Step 2.

The 3 Spec Files

Claude Web generates three Markdown files that together form a complete blueprint for your application. Each file serves a different purpose in the build pipeline.

1

project-description.md

The full project specification. Contains the project name, description, every model with its fields and relationships, user roles and permissions, feature list, and API endpoints. This is the single source of truth for what the application does.

project-description.md (Job Board example)
# Job Board — Project Description

## Overview
A full-stack job board where companies post listings
and candidates browse and apply.

## Models

### Company
- name: string (required)
- slug: slug (unique)
- logo: string
- website: string
- description: text
- user: belongs_to (the employer who owns it)

### Job
- title: string (required)
- slug: slug (unique)
- description: text (required)
- location: string
- salary_min: int
- salary_max: int
- job_type: string (full-time | part-time | contract | remote)
- published: bool (default: false)
- company: belongs_to
- category: belongs_to

### Category
- name: string (required, unique)
- slug: slug (unique)
- description: text

### Application
- cover_letter: text
- resume_url: string
- status: string (pending | reviewed | accepted | rejected)
- job: belongs_to
- user: belongs_to (the applicant)

## User Roles
- ADMIN: full access to all resources
- EMPLOYER: can manage their own company and jobs
- USER: can browse jobs and submit applications

## Features
- Public job listing page with search and filters
- Company profile pages
- Job detail pages with "Apply" button
- Application tracking for users
- Admin dashboard with stats and management
2

claude-code-prompt.md

Step-by-step instructions that you feed directly to Claude Code. Contains the exact grit CLI commands to run, in the correct order. Claude Code reads this file and executes each step automatically.

claude-code-prompt.md (Job Board example)
# Claude Code — Build Instructions

Read GRIT_SKILL.md first to understand the framework.
Then read project-description.md for the full spec.
Execute these steps in order:

## Phase 1: Scaffold and Core Models

1. Scaffold the project:
   grit new jobboard
   cd jobboard

2. Start infrastructure:
   docker compose up -d

3. Add the EMPLOYER role:
   grit add role EMPLOYER

4. Generate core resources:
   grit generate resource Category --fields "name:string,slug:slug,description:text"
   grit generate resource Company --fields "name:string,slug:slug,logo:string,website:string,description:text,user_id:belongs_to"
   grit generate resource Job --fields "title:string,slug:slug,description:text,location:string,salary_min:int,salary_max:int,job_type:string,published:bool,company_id:belongs_to,category_id:belongs_to"
   grit generate resource Application --fields "cover_letter:text,resume_url:string,status:string,job_id:belongs_to,user_id:belongs_to"

5. Verify the build:
   cd apps/api && go build ./... && cd ../..

## Phase 2: Relationships and Business Logic

6. Update Go models to add Preload in services
7. Add a public endpoint for published jobs
8. Add role-based route guards for EMPLOYER routes
9. Run grit sync to update TypeScript types

## Phase 3: Frontend Customization

10. Customize admin resource definitions
11. Build the public job listing page
12. Build the company profile page
13. Add search and filter functionality
3

project-phases.md

A phased checklist that breaks the build into manageable stages. Phase 1 covers scaffolding and core models. Phase 2 handles relationships and advanced features. Phase 3 is frontend customization and polish. This prevents Claude Code from trying to do everything at once.

project-phases.md (Job Board example)
# Job Board — Build Phases

## Phase 1: Scaffold + Core Models
- [ ] Run grit new jobboard
- [ ] Start Docker services
- [ ] Add EMPLOYER role with grit add role
- [ ] Generate Category resource
- [ ] Generate Company resource
- [ ] Generate Job resource
- [ ] Generate Application resource
- [ ] Verify go build ./... passes

## Phase 2: Relationships + Business Logic
- [ ] Add Preload("Company") and Preload("Category") to Job service
- [ ] Add Preload("Job") to Application service
- [ ] Create public /api/jobs/published endpoint
- [ ] Add EMPLOYER route guards for company/job management
- [ ] Add status workflow for applications (pending -> reviewed -> accepted/rejected)
- [ ] Run grit sync to update TypeScript types
- [ ] Verify go build ./... passes

## Phase 3: Frontend + Polish
- [ ] Customize Job admin resource (badges, filters, relation columns)
- [ ] Customize Application admin resource (status badges, job relation)
- [ ] Build public job listing page with search and category filter
- [ ] Build job detail page with Apply button
- [ ] Build company profile page
- [ ] Add application tracking page for logged-in users
- [ ] Test full flow: post job -> browse -> apply -> review

Step 2: Building with Claude Code

Once you have the 3 spec files from Claude Web, it's time to hand them to Claude Code and let it build the application. Claude Code is an AI coding agent that runs in your terminal — it can execute shell commands, read and edit files, and build entire projects autonomously.

1

Install Claude Code

Install Claude Code globally using npm. You need Node.js 18+ installed.

Terminal
npm install -g @anthropic-ai/claude-code
2

Open your terminal in an empty directory

Create a new folder for your project and navigate into it. Place the 3 spec files from Claude Web into this directory.

Terminal
mkdir jobboard-project && cd jobboard-project

# Place your 3 spec files here:
# - project-description.md
# - claude-code-prompt.md
# - project-phases.md
3

Start a Claude Code session

Launch Claude Code in the project directory. It will detect the spec files and be ready to execute instructions.

Terminal
claude
4

Feed it the claude-code-prompt.md

Tell Claude Code to read the prompt file and execute the instructions. It will scaffold the project, generate every resource, and build the app step by step.

Message to Claude Code
Read claude-code-prompt.md and project-description.md.
Execute all the steps in Phase 1 of the build instructions.
After each grit command, verify the output looks correct
before moving to the next step.
5

Review and iterate

After each phase, review what Claude Code built. Check that the Go API compiles, models look correct, and the admin panel renders properly. Then tell it to proceed with the next phase, or ask for adjustments.

Follow-up messages
# After Phase 1 completes:
Phase 1 looks good. Now execute Phase 2 from the build instructions.

# If something needs fixing:
The Job model needs a "deadline" field (datetime). Add it and re-run grit sync.

# When ready for frontend work:
Execute Phase 3. Customize the admin resources and build the public pages.

The Grit Skill File

Every Grit project generated with grit new includes a GRIT_SKILL.md file in the project root. This file teaches Claude Code (and any other AI assistant) how your Grit project works — the folder structure, CLI commands, code patterns, naming conventions, and injection markers.

When Claude Code opens your project directory, it automatically reads GRIT_SKILL.md and gains full context about how to work with Grit. If you are starting from scratch (before running grit new), you can create this file manually so Claude Code already understands Grit before scaffolding begins.

Tip: Copy the skill file below and save it as GRIT_SKILL.md in your project directory before starting Claude Code. This ensures the AI understands Grit conventions from the very first message.

GRIT_SKILL.md
# Grit Framework — AI Skill Context

> Give this file to any AI coding assistant to teach it how to work with your Grit project.

## What is Grit?

Grit is a full-stack framework: Go (Gin + GORM) backend + Next.js (React + TypeScript) frontend in a monorepo.

## CLI Commands

grit new <name>                    # Scaffold full project
grit new <name> --api              # API only
grit generate resource <Name> --fields "field:type,..."  # Full-stack CRUD
grit remove resource <Name>        # Remove a resource
grit sync                          # Sync Go types → TypeScript
grit migrate                       # Run GORM AutoMigrate
grit seed                          # Seed database
grit add role <ROLE>               # Add a new role

## Field Types

string, text, int, uint, float, bool, datetime, date, slug
belongs_to (e.g., category:belongs_to)
many_to_many (e.g., tags:many_to_many:Tag)

## Project Structure

project/
├── apps/api/           # Go backend (Gin + GORM)
│   ├── cmd/server/     # Entry point
│   └── internal/       # models, handlers, services, middleware, routes
├── apps/web/           # Next.js frontend
├── apps/admin/         # Admin panel (resource-based)
├── packages/shared/    # Zod schemas, TS types, constants
└── docker-compose.yml  # PostgreSQL, Redis, MinIO, Mailhog

## Conventions

- Go models: PascalCase structs with gorm/json/binding tags
- API responses: { "data": ..., "meta": { "total", "page", "page_size", "pages" } }
- Errors: { "error": { "code": "...", "message": "..." } }
- TS files: kebab-case (use-users.ts, api-client.ts)
- Routes: plural, lowercase (/api/users, /api/posts)
- Validation: Zod schemas in packages/shared/schemas/
- Data fetching: React Query hooks (useQuery, useMutation)
- Styling: Tailwind CSS + shadcn/ui, dark theme default
- Admin: defineResource() API with DataTable, FormBuilder, widgets

## Code Generation Markers (DO NOT REMOVE)

// grit:models, /* grit:studio */, // grit:handlers, // grit:routes:protected,
// grit:routes:admin, // grit:routes:custom, // grit:schemas, // grit:types,
// grit:api-routes, // grit:resources, // grit:resource-list

## How to Build with Grit

1. grit new myapp && cd myapp && docker compose up -d
2. grit generate resource <Name> --fields "..." for each model
3. cd apps/api && air (hot reload)
4. cd apps/admin && pnpm install && pnpm dev
5. Customize handlers, add business logic, build frontend pages

Tips & Best Practices

Let Claude Code run grit commands

Do not manually type grit commands in a separate terminal. Let Claude Code execute them so it can read the output, detect errors, and fix issues automatically. The whole point of the workflow is hands-free building.

Review generated models before adding relationships

After generating core resources, check that the Go models have the correct field types and tags before adding belongs_to or many_to_many relationships. It is easier to regenerate a resource early than to fix relationships later.

Use phases — do not try to build everything at once

The phased approach prevents Claude Code from getting overwhelmed. Complete Phase 1 (scaffold + core models), verify it compiles, then move to Phase 2 (relationships), and so on. Each phase builds on a working foundation.

Always check go build ./... after each phase

This catches compilation errors early. If Claude Code introduces a bug in Phase 1, you want to find it before Phase 2 adds more complexity on top. Include this step in your claude-code-prompt.md.

Use grit remove resource if you need to redo something

If a resource was generated with the wrong fields, remove it completely and regenerate. This is cleaner than manually editing multiple files across the monorepo. The CLI handles cleanup in all layers.

Keep GRIT_SKILL.md in your project root

Claude Code automatically reads files in the project root. Having the skill file there means every new Claude Code session starts with full Grit context, no manual pasting required.

Complete Prompt Template for Claude Web

Here is the full, ready-to-copy prompt that you can paste directly into claude.ai. Replace the bracketed sections with your own project details and Claude will generate all 3 spec files in a single response.

Copy this entire prompt into claude.ai
I want to build a [PROJECT NAME] using the Grit framework.

Grit is a full-stack meta-framework that uses:
- Go backend (Gin web framework + GORM ORM)
- Next.js frontend (React + App Router + TypeScript)
- Admin panel (resource-based, Filament-like)
- Monorepo with shared types and validation (Zod)
- Docker for infrastructure (PostgreSQL, Redis, MinIO)

Here's what I want to build:
[DESCRIBE YOUR PROJECT IN DETAIL]

Please create these 3 files for me:

1. project-description.md — Full project spec with all models, their
   fields (use Grit field types: string, text, int, uint, float, bool,
   datetime, date, slug, belongs_to, many_to_many), relationships,
   user roles, and features.

2. claude-code-prompt.md — Step-by-step instructions that I'll give
   to Claude Code (AI coding agent). Include exact grit CLI commands
   to run in order. Use `grit generate resource <Name> --fields "..."`
   syntax.

3. project-phases.md — A phased build plan with checkboxes. Phase 1:
   scaffold + core models. Phase 2: relationships + complex features.
   Phase 3: frontend customization + polish.

Tip: The more detail you provide in the [DESCRIBE YOUR PROJECT] section, the better your spec files will be. Include specific field names and types, relationships between models, user roles and permissions, and any custom business logic or API endpoints you need.