skills.rest
m19803261706
m19803261706COMMUNITY
Explore all skills by this author →
GitHub

cx-design

Generate technical design documents defining API contracts from PRDs and code.

Updated Feb 6, 2026
Search Tags:#api design#data modeling#technical design#backend development#frontend development#contract definition
One-click install
npx skills add https://github.com/m19803261706/cx-workflow --skill cx-design
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: cx-design
Source: https://github.com/m19803261706/cx-workflow/tree/main/skills/cx-design
Command: npx skills add https://github.com/m19803261706/cx-workflow --skill cx-design

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill ensures that front-end and back-end development are perfectly synchronized by defining clear API contracts before any code is written, preventing integration issues and saving development time.

Core Features & Use Cases

  • API Contract Definition: Generates a comprehensive Design Doc including API endpoints, request/response structures, status codes, and error codes.
  • Data Model Mapping: Defines clear mappings between database fields, DTOs, and front-end types.
  • State Enumeration: Standardizes and documents all possible states and their transitions for business entities.
  • Use Case: When developing a new feature, use this Skill to automatically generate a Design Doc that outlines all necessary API interactions, ensuring developers on both ends have a shared, unambiguous understanding of the data contracts.

Quick Start

Run /cx-design to generate a technical design document for the current feature.

Frequently Asked Questions about cx-design

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I define API contracts to align frontend and backend development?▼

You can define API contracts by generating a technical design document that standardizes API endpoints, request/response structures, status codes, and data model mappings. This ensures frontend and backend alignment before code is written.

How do I generate a technical design document from a PRD?▼

Generate a technical design document by reading the PRD and scanning existing code to produce a markdown file. This document outlines API interactions, state enumerations, and data mappings, saving locally for team reference.

What is the best way to document data model mappings for API contracts?▼

The best way to document data model mappings is to define clear relationships between database fields, DTOs, and frontend types within a design doc. This standardizes data contracts and prevents integration issues.

Can I create a GitHub issue for API design collaboration directly from the design doc?▼

Yes, you can create a GitHub issue for collaboration directly after generating the API design document. This feature allows the team to discuss the standardized API endpoints and state enumerations asynchronously.

When do I need to standardize state enumerations for business entities?▼

You need to standardize state enumerations when defining API contracts for business entities to document all possible states and transitions. This ensures unambiguous understanding of data contracts across frontend and backend teams.

Related Skills

Explore More Software Engineering Skills→
kk20300113-pngkk20300113-png

to-prd

Synthesize conversation context and codebase insights into structured PRDs and publish them to the issue tracker.

Community
Intermediate
GuitarAlchemistGuitarAlchemist

proof

Create and edit shared Markdown documents through Proof's web API.

Official
Intermediate
parhummparhumm
25

backend-service-implement

Generate backend service implementations from API contracts and scaffold stubs.

Community
Advanced
enigmaicon-engenigmaicon-eng
1

bmad-agent-tech-writer

Generate audience-aware technical documentation with Mermaid diagrams and validation.

Community
Intermediate