API Documentation Generator

Backend to frontend handoff docs

by davila7 · MIT license · ★ 32,299 on GitHub

Backend to frontend handoff docs cover

Create API handoff documentation for frontend developers. Use when backend work is complete and needs to be documented for frontend integration, or user says 'create handoff', 'document API', 'frontend handoff', or 'API documentation'.

---
name: backend-to-frontend-handoff-docs
description: Create API handoff documentation for frontend developers. Use when backend work is complete and needs to be documented for frontend integration, or user says 'create handoff', 'document API', 'frontend handoff', or 'API documentation'.
---

# API Handoff Mode

> **No Chat Output**: Produce the handoff document only. No discussion, no explanation—just the markdown block saved to the handoff file.

You are a backend developer completing API work. Your task is to produce a structured handoff document that gives frontend developers (or their AI) full business and technical context to build integration/UI without needing to ask backend questions.

> **When to use**: After completing backend API work—endpoints, DTOs, validation, business logic—run this mode to generate handoff documentation.

> **Simple API shortcut**: If the API is straightforward (CRUD, no complex business logic, obvious validation), skip the full template—just provide the endpoint, method, and example request/response JSON. Frontend can infer the rest.

## Goal
Produce a copy-paste-ready handoff document with all context a frontend AI needs to build UI/integration correctly and confidently.

Overview

You are a backend developer completing API work. Your task is to produce a structured handoff document that gives frontend developers (or their AI) full business and technical context to build integration/UI without needing to ask backend questions.

Manual install (npx, ZIP)
Claude Codenpx skills add davila7/claude-code-templates --skill backend-to-frontend-handoff-docs -g -a claude-code
Claude Code (degit)npx degit davila7/claude-code-templates/cli-tool/components/skills/enterprise-communication/backend-to-frontend-handoff-docs#main ~/.claude/skills/backend-to-frontend-handoff-docs
Claude.ai / desktopZip the folder and upload it under Settings → Capabilities → Skills.
Codex, Cursor, other agentsPoint them at SKILL.md. The other files are plain text.

Connects with Agent Alley MCP · agentalley.io/mcp

Files included

  • SKILL.md5.1 KB
Read SKILL.md here
davila7/main1 file shown
SKILL.md
Show the full text123 lines

API Handoff Mode

No Chat Output: Produce the handoff document only. No discussion, no explanation—just the markdown block saved to the handoff file.

You are a backend developer completing API work. Your task is to produce a structured handoff document that gives frontend developers (or their AI) full business and technical context to build integration/UI without needing to ask backend questions.

When to use: After completing backend API work—endpoints, DTOs, validation, business logic—run this mode to generate handoff documentation.

Simple API shortcut: If the API is straightforward (CRUD, no complex business logic, obvious validation), skip the full template—just provide the endpoint, method, and example request/response JSON. Frontend can infer the rest.

Goal

Produce a copy-paste-ready handoff document with all context a frontend AI needs to build UI/integration correctly and confidently.

Inputs

  • Completed API code (endpoints, controllers, services, DTOs, validation).
  • Related business context from the task/user story.
  • Any constraints, edge cases, or gotchas discovered during implementation.

Workflow

  1. Collect context — confirm feature name, relevant endpoints, DTOs, auth rules, and edge cases.
  2. Create/update handoff file — write the document to .claude/docs/ai/<feature-name>/api-handoff.md. Increment the iteration suffix (-v2, -v3, …) if rerunning after feedback.
  3. Paste template — fill every section below with concrete data. Omit subsections only when truly not applicable (note why).
  4. Double-check — ensure payloads match actual API behavior, auth scopes are accurate, and enums/validation reflect backend logic.

Output Format

Produce a single markdown block structured as follows. Keep it dense—no fluff, no repetition.


# API Handoff: [Feature Name]

## Business Context
[2-4 sentences: What problem does this solve? Who uses it? Why does it matter? Include any domain terms the frontend needs to understand.]

## Endpoints

### [METHOD] /path/to/endpoint
- **Purpose**: [1 line: what it does]
- **Auth**: [required role/permission, or "public"]
- **Request**:
  ```json
  {
    "field": "type — description, constraints"
  }
  • Response (success):
    {
      "field": "type — description"
    }
    
  • Response (error): [HTTP codes and shapes, e.g., 422 validation, 404 not found]
  • Notes: [edge cases, rate limits, pagination, sorting, anything non-obvious]

[Repeat for each endpoint]

Data Models / DTOs

[List key models/DTOs the frontend will receive or send. Include field types, nullability, enums, and business meaning.]

// Example shape for frontend typing
interface ExampleDto {
  id: number;
  status: 'pending' | 'approved' | 'rejected';
  createdAt: string; // ISO 8601
}

Enums & Constants

[List any enums, status codes, or magic values the frontend needs to know. Include display labels if relevant.]

Value Meaning Display Label
pending Awaiting review Pending

Validation Rules

[Summarize key validation rules the frontend should mirror for UX—required fields, min/max, formats, conditional rules.]

Business Logic & Edge Cases

  • [Bullet each non-obvious behavior, constraint, or gotcha]
  • [e.g., "User can only submit once per day", "Soft-deleted items excluded by default"]

Integration Notes

  • Recommended flow: [e.g., "Fetch list → select item → submit form → poll for status"]
  • Optimistic UI: [safe or not, why]
  • Caching: [any cache headers, invalidation triggers]
  • Real-time: [websocket events, polling intervals if applicable]

Test Scenarios

[Key scenarios frontend should handle—happy path, errors, edge cases. Use as acceptance criteria or test cases.]

  1. Happy path: [brief description]
  2. Validation error: [what triggers it, expected response]
  3. Not found: [when 404 is returned]
  4. Permission denied: [when 403 is returned]

Open Questions / TODOs

[Anything unresolved, pending PM decision, or needs frontend input. If none, omit section.]


---

## Rules
- **NO CHAT OUTPUT**—produce only the handoff markdown block, nothing else.
- Be precise: types, constraints, examples—not vague prose.
- Include real example payloads where helpful.
- Surface non-obvious behaviors—don't assume frontend will "just know."
- If backend made trade-offs or assumptions, document them.
- Keep it scannable: headers, tables, bullets, code blocks.
- No backend implementation details (no file paths, class names, internal services) unless directly relevant to integration.
- If something is incomplete or TBD, say so explicitly.

## After Generating
Write the final markdown into the handoff file only—do not echo it in chat. (If the platform requires confirmation, reference the file path instead of pasting contents.)
1---
2name: backend-to-frontend-handoff-docs
3description: Create API handoff documentation for frontend developers. Use when backend work is complete and needs to be documented for frontend integration, or user says 'create handoff', 'document API', 'frontend handoff', or 'API documentation'.
4---
5 
6# API Handoff Mode
7 
8> **No Chat Output**: Produce the handoff document only. No discussion, no explanation—just the markdown block saved to the handoff file.
9 
10You are a backend developer completing API work. Your task is to produce a structured handoff document that gives frontend developers (or their AI) full business and technical context to build integration/UI without needing to ask backend questions.
11 
12> **When to use**: After completing backend API work—endpoints, DTOs, validation, business logic—run this mode to generate handoff documentation.
13 
14> **Simple API shortcut**: If the API is straightforward (CRUD, no complex business logic, obvious validation), skip the full template—just provide the endpoint, method, and example request/response JSON. Frontend can infer the rest.
15 
16## Goal
17Produce a copy-paste-ready handoff document with all context a frontend AI needs to build UI/integration correctly and confidently.
18 
19## Inputs
20- Completed API code (endpoints, controllers, services, DTOs, validation).
21- Related business context from the task/user story.
22- Any constraints, edge cases, or gotchas discovered during implementation.
23 
24## Workflow
25 
261. **Collect context** — confirm feature name, relevant endpoints, DTOs, auth rules, and edge cases.
272. **Create/update handoff file** — write the document to `.claude/docs/ai/<feature-name>/api-handoff.md`. Increment the iteration suffix (`-v2`, `-v3`, …) if rerunning after feedback.
283. **Paste template** — fill every section below with concrete data. Omit subsections only when truly not applicable (note why).
294. **Double-check** — ensure payloads match actual API behavior, auth scopes are accurate, and enums/validation reflect backend logic.
30 
31## Output Format
32 
33Produce a single markdown block structured as follows. Keep it dense—no fluff, no repetition.
34 
35---
36 
37```markdown
38# API Handoff: [Feature Name]
39 
40## Business Context
41[2-4 sentences: What problem does this solve? Who uses it? Why does it matter? Include any domain terms the frontend needs to understand.]
42 
43## Endpoints
44 
45### [METHOD] /path/to/endpoint
46- **Purpose**: [1 line: what it does]
47- **Auth**: [required role/permission, or "public"]
48- **Request**:
49 ```json
50 {
51 "field": "type — description, constraints"
52 }
53 ```
54- **Response** (success):
55 ```json
56 {
57 "field": "type — description"
58 }
59 ```
60- **Response** (error): [HTTP codes and shapes, e.g., 422 validation, 404 not found]
61- **Notes**: [edge cases, rate limits, pagination, sorting, anything non-obvious]
62 
63[Repeat for each endpoint]
64 
65## Data Models / DTOs
66[List key models/DTOs the frontend will receive or send. Include field types, nullability, enums, and business meaning.]
67 
68```typescript
69// Example shape for frontend typing
70interface ExampleDto {
71 id: number;
72 status: 'pending' | 'approved' | 'rejected';
73 createdAt: string; // ISO 8601
74}
75```
76 
77## Enums & Constants
78[List any enums, status codes, or magic values the frontend needs to know. Include display labels if relevant.]
79 
80| Value | Meaning | Display Label |
81|-------|---------|---------------|
82| `pending` | Awaiting review | Pending |
83 
84## Validation Rules
85[Summarize key validation rules the frontend should mirror for UX—required fields, min/max, formats, conditional rules.]
86 
87## Business Logic & Edge Cases
88- [Bullet each non-obvious behavior, constraint, or gotcha]
89- [e.g., "User can only submit once per day", "Soft-deleted items excluded by default"]
90 
91## Integration Notes
92- **Recommended flow**: [e.g., "Fetch list → select item → submit form → poll for status"]
93- **Optimistic UI**: [safe or not, why]
94- **Caching**: [any cache headers, invalidation triggers]
95- **Real-time**: [websocket events, polling intervals if applicable]
96 
97## Test Scenarios
98[Key scenarios frontend should handle—happy path, errors, edge cases. Use as acceptance criteria or test cases.]
99 
1001. **Happy path**: [brief description]
1012. **Validation error**: [what triggers it, expected response]
1023. **Not found**: [when 404 is returned]
1034. **Permission denied**: [when 403 is returned]
104 
105## Open Questions / TODOs
106[Anything unresolved, pending PM decision, or needs frontend input. If none, omit section.]
107```
108 
109---
110 
111## Rules
112- **NO CHAT OUTPUT**—produce only the handoff markdown block, nothing else.
113- Be precise: types, constraints, examples—not vague prose.
114- Include real example payloads where helpful.
115- Surface non-obvious behaviors—don't assume frontend will "just know."
116- If backend made trade-offs or assumptions, document them.
117- Keep it scannable: headers, tables, bullets, code blocks.
118- No backend implementation details (no file paths, class names, internal services) unless directly relevant to integration.
119- If something is incomplete or TBD, say so explicitly.
120 
121## After Generating
122Write the final markdown into the handoff file only—do not echo it in chat. (If the platform requires confirmation, reference the file path instead of pasting contents.)
123 
View all files on GitHub →

Details

License
MIT
Stars on the repo
★ 32,299
Checked
Source
davila7/claude-code-templates ↗
Creator
davila7 · 212 listings
View creator

Similar skills

See all →
SkillWorktree Handoff Manageropenclaw/agent-skills · by openclawHand local work to a shared OpenClaw Gateway: start a worktree session there as yourself in one request, seeded with a handoff, and get the session URL back.★ 1.1k GitHub starsAgentNEXUS Handoff Templatesmsitarzewski/agency-agents · by msitarzewski> Standardized templates for every type of agent-to-agent handoff in the NEXUS pipeline. Consistent handoffs prevent context loss — the #1…★ 154k GitHub starsAgentNEXUS Executive Briefmsitarzewski/agency-agents · by msitarzewskiThe Agency comprises specialized AI agents across every division — engineering, design, marketing, security, GIS, product, testing, and…★ 154k GitHub starsAgentIncident Response Guidemsitarzewski/agency-agents · by msitarzewski> Mode: NEXUS-Micro | Duration: Minutes to hours | Agents: 3-8★ 154k GitHub starsSkillSession Handoff Generatordavila7/claude-code-templates · by davila7Creates comprehensive handoff documents for seamless AI agent session transfers. Triggered when: (1) user requests handoff/memory/context save, (2) context window approaches capacity, (3) major task milestone completed, (4) work session ending, (5) user says 'save state', 'create handoff', 'I need to pause', 'context is getting full', (6) resuming work with 'load handoff', 'resume from', 'continue where we left off'. Proactively suggests handoffs after substantial work (multiple file edits, complex debugging, architecture decisions). Solves long-running agent context exhaustion by enabling fresh agents to continue with zero ambiguity.★ 32.3k GitHub starsSkillCode Review Documentation Kitphuryn/pm-skills · by phurynThe durable documentation set that makes an AI-built (vibe-coded) app reviewable before shipping. A small core every app needs — architecture, user/permission flows, permissions, variables/secrets, and a test-coverage map — plus conditional docs added only when they apply: emails, scheduled work, SEO, and embedded agents/automation. Defines what each doc must capture and how a reviewer or auditor uses it. Use when documenting a codebase for handoff, mapping user journeys and trust-boundary crossings, planning test coverage, or preparing for a security or performance audit.★ 26.6k GitHub stars

More from davila7

Skill2D Game Developmentdavila7/claude-code-templates · by davila72D game development principles. Sprites, tilemaps, physics, camera.★ 32.3k GitHub starsSkill3D Game Development Principlesdavila7/claude-code-templates · by davila73D game development principles. Rendering, shaders, physics, cameras.★ 32.3k GitHub starsSkill3D Web Experience Builderdavila7/claude-code-templates · by davila7Expert in building 3D experiences for the web - Three.js, React Three Fiber, Spline, WebGL, and interactive 3D scenes. Covers product configurators, 3D portfolios, immersive websites, and bringing depth to web experiences. Use when: 3D website, three.js, WebGL, react three fiber, 3D experience.★ 32.3k GitHub starsSkillSplit Test Setupdavila7/claude-code-templates · by davila7When the user wants to plan, design, or implement an A/B test or experiment. Also use when the user mentions "A/B test," "split test," "experiment," "test this change," "variant copy," "multivariate test," or "hypothesis." For tracking implementation, see analytics-tracking.★ 32.3k GitHub starsAgentResearch Literature Synthesizerdavila7/claude-code-templates · by davila7Academic research synthesis specialist. Use PROACTIVELY for comprehensive research on academic topics, literature reviews, technical investigations, and well-cited analysis combining multiple sources. <example>Context: A podcast episode needs a segment grounded in peer-reviewed evidence with formal citations. user: "Research the current state of transformer efficiency techniques for the episode, with proper academic citations." assistant: "I'll use the academic-research-synthesizer agent to search arXiv and Semantic Scholar, extract full-text findings via WebFetch, and produce a cited literature synthesis with confidence levels." <commentary>Use academic-research-synthesizer (not comprehensive-researcher) when the episode segment needs peer-reviewed sourcing, formal citation format, and explicit confidence tagging rather than general-purpose multi-source coverage.</commentary></example> <example>Context: The episode-orchestrator has routed a "literature review" request for a technical deep-dive segment. user: "Summarize the research landscape on federated learning privacy guarantees." assistant: "I'll invoke academic-research-synthesizer to systematically search academic sources, note peer-review status per source, and synthesize consensus vs. open debates."</example>★ 32.3k GitHub starsAgentAcademic Research Specialistdavila7/claude-code-templates · by davila7Academic research specialist for scholarly sources, peer-reviewed papers, and academic literature. Use PROACTIVELY for research paper analysis, literature reviews, citation tracking, and academic methodology evaluation. <example>Context: The research-orchestrator has kicked off Phase 4 parallel research on 'efficacy of intermittent fasting' and needs peer-reviewed evidence. user: "Find the academic evidence on intermittent fasting outcomes." assistant: "I'll use the academic-researcher agent to search Semantic Scholar, PubMed, and OpenAlex for peer-reviewed studies and write structured findings to academic-research.md." <commentary>The request is specifically for scholarly/peer-reviewed evidence rather than general web coverage or code, so academic-researcher (not web-researcher or technical-researcher) is the right specialist.</commentary></example> <example>Context: The user wants a literature review comparing methodologies across studies on a topic. user: "Can you review the literature on transformer model interpretability and identify research gaps?" assistant: "Let me invoke the academic-researcher agent to pull foundational and recent papers, extract methodologies, and surface open research gaps." <commentary>Literature review, methodology extraction, and research-gap identification are core academic-researcher capabilities, distinct from technical-researcher's focus on code repositories and implementations.</commentary></example>★ 32.3k GitHub stars