Agent skill

Implementing API Patterns

by ancoleman in ancoleman/ai-design-components

API design and implementation across REST, GraphQL, gRPC, and tRPC patterns.

MITAuto-check passedBackend & APIs

Install Implementing API Patterns

skills CLI
$ npx skills add ancoleman/ai-design-components --skill implementing-api-patterns -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install ancoleman/ai-design-components implementing-api-patterns --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/ancoleman/ai-design-components.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/implementing-api-patterns .claude/skills/implementing-api-patterns && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
implementing-api-patterns
GitHub stars
526
Used in
1 other repo
Token cost
~3k tokens
SKILL.md length
721 words
Files
27 (incl. scripts, references)
Skills in repo
75
Repo updated
First seen
Licence
MIT

At a glance

API design and implementation across REST, GraphQL, gRPC, and tRPC patterns.

  • Building backend services
  • SKILL.md covers Purpose, When to Use This Skill, Quick Decision Framework and REST Framework Selection, plus 9 more sections
  • Runs Python and TypeScript scripts from its folder
  • Service-to-service communication

What it does

Implementing API Patterns is an agent skill from ancoleman/ai-design-components. API design and implementation across REST, GraphQL, gRPC, and tRPC patterns. Use when building backend services, public APIs, or service-to-service communication. Covers REST frameworks (FastAPI, Axum, Gin, Hono), GraphQL libraries (Strawberry, async-graphql, gqlgen, Pothos), gRPC (Tonic, Connect-Go), tRPC for TypeScript, pagination strategies (cursor-based, offset-based), rate limiting, caching, versioning, and OpenAPI documentation generation. Includes frontend integration patterns for forms, tables…

Its SKILL.md is about 3k tokens, which your agent loads only when the skill is triggered. The skill folder holds 34 other files, including scripts and reference files (for example `README.md`, `examples/go-gin/README.md` and `examples/graphql-strawberry/README.md`).

It sits in Backend & APIs, covering gRPC and Protobuf, GraphQL and OpenAPI specifications. It works with tRPC, TypeScript, GraphQL and Hono. The repository describes itself as: Comprehensive UI/UX and Backend component design skills for AI-assisted development with Claude. The licence is MIT.

When your agent uses it

  • Building backend services
  • Service-to-service communication

Example prompts

  • “/implementing-api-patterns”

Requirements

  • Python 3
  • Node.js

What it can do on your machine

Read from SKILL.md and the folder at commit 76551b7. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Ships 1 file in scripts/ (Python and TypeScript, from the files we listed), which the agent can run.

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Implementing API Patterns loads about 3k tokens when it runs, and up to ~34k if it reads all its reference files. Until then it costs about 141 tokens; SKILL.md has 721 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~141
When it runs · the whole SKILL.md, loaded when a task matches
~3k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~34k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); the scripts in this folder are not scanned.

SKILL.md

The full file from ancoleman/ai-design-components at commit 76551b7, republished under its MIT licence (© ancoleman). 721 words, ~2,956 tokens.

Download SKILL.mdSave it as .claude/skills/implementing-api-patterns/SKILL.md (or your agent's skills folder). This skill also uses 26 other files; get the full folder from GitHub.
name
implementing-api-patterns
description
API design and implementation across REST, GraphQL, gRPC, and tRPC patterns. Use when building backend services, public APIs, or service-to-service communication. Covers REST frameworks (FastAPI, Axum, Gin, Hono), GraphQL libraries (Strawberry, async-graphql, gqlgen, Pothos), gRPC (Tonic, Connect-Go), tRPC for TypeScript, pagination strategies (cursor-based, offset-based), rate limiting, caching, versioning, and OpenAPI documentation generation. Includes frontend integration patterns for forms, tables, dashboards, and ai-chat skills.

API Patterns Skill

Purpose

Design and implement APIs using the optimal pattern and framework for the use case. Choose between REST, GraphQL, gRPC, and tRPC based on API consumers, performance requirements, and type safety needs.

When to Use This Skill

Use when:

  • Building backend APIs for web, mobile, or service consumers
  • Connecting frontend components (forms, tables, dashboards) to databases
  • Implementing pagination, rate limiting, or caching strategies
  • Generating OpenAPI documentation automatically
  • Choosing between REST, GraphQL, gRPC, or tRPC patterns
  • Integrating authentication and authorization
  • Optimizing API performance and scalability

Quick Decision Framework

WHO CONSUMES YOUR API?
├─ PUBLIC/THIRD-PARTY DEVELOPERS → REST with OpenAPI
│  ├─ Python → FastAPI (auto-docs, 40k req/s)
│  ├─ TypeScript → Hono (edge-first, 50k req/s, 14KB)
│  ├─ Rust → Axum (140k req/s, <1ms latency)
│  └─ Go → Gin (100k+ req/s, mature ecosystem)
│
├─ FRONTEND TEAM (same org)
│  ├─ TypeScript full-stack? → tRPC (E2E type safety)
│  └─ Complex data needs? → GraphQL
│      ├─ Python → Strawberry
│      ├─ Rust → async-graphql
│      ├─ Go → gqlgen
│      └─ TypeScript → Pothos
│
├─ SERVICE-TO-SERVICE (microservices)
│  └─ High performance → gRPC
│      ├─ Rust → Tonic
│      ├─ Go → Connect-Go (browser-friendly)
│      └─ Python → grpcio
│
└─ MOBILE APPS
   ├─ Bandwidth constrained → GraphQL (request only needed fields)
   └─ Simple CRUD → REST (standard, well-understood)

REST Framework Selection

Key Features: Auto OpenAPI docs, Pydantic v2 validation, async/await, 40k req/s

Basic Example:

python
from fastapi import FastAPI
from pydantic import BaseModel

app = FastAPI()

class Item(BaseModel):
    name: str
    price: float

@app.post("/items")
async def create_item(item: Item):
    return {"id": 1, **item.dict()}

See references/rest-design-principles.md for FastAPI patterns and examples/python-fastapi/.

TypeScript: Hono (Edge-First)

Key Features: 14KB bundle, runs on any runtime (Node/Deno/Bun/edge), Zod validation, 50k req/s

Basic Example:

typescript
import { Hono } from 'hono'
import { zValidator } from '@hono/zod-validator'
import { z } from 'zod'

const app = new Hono()
app.post('/items', zValidator('json', z.object({
  name: z.string(), price: z.number()
})), (c) => c.json({ id: 1, ...c.req.valid('json') }))

See references/rest-design-principles.md for Hono patterns and examples/typescript-hono/.

TypeScript: tRPC (Full-Stack Type Safety)

Key Features: Zero codegen, E2E type safety, React Query integration, WebSocket subscriptions

Basic Example:

typescript
import { initTRPC } from '@trpc/server'
import { z } from 'zod'

const t = initTRPC.create()
export const appRouter = t.router({
  createItem: t.procedure
    .input(z.object({ name: z.string(), price: z.number() }))
    .mutation(({ input }) => ({ id: '1', ...input }))
})
export type AppRouter = typeof appRouter

See references/trpc-setup-guide.md for setup patterns and examples/typescript-trpc/.

Rust: Axum (High Performance)

Key Features: Tower middleware, type-safe extractors, 140k req/s, compile-time verification

Basic Example:

rust
use axum::{routing::post, Json, Router};
use serde::{Deserialize, Serialize};

#[derive(Deserialize)]
struct CreateItem { name: String, price: f64 }

#[derive(Serialize)]
struct Item { id: u64, name: String, price: f64 }

async fn create_item(Json(payload): Json<CreateItem>) -> Json<Item> {
    Json(Item { id: 1, name: payload.name, price: payload.price })
}

See references/rest-design-principles.md for Axum patterns and examples/rust-axum/.

Go: Gin (Mature Ecosystem)

Key Features: Largest Go ecosystem, 100k+ req/s, struct tag validation

Basic Example:

go
type Item struct {
    Name  string  `json:"name" binding:"required"`
    Price float64 `json:"price" binding:"required,gt=0"`
}

r := gin.Default()
r.POST("/items", func(c *gin.Context) {
    var item Item
    if c.ShouldBindJSON(&item); err != nil {
        c.JSON(400, gin.H{"error": err.Error()}); return
    }
    c.JSON(201, item)
})

See references/rest-design-principles.md for Gin patterns and examples/go-gin/.

Performance Benchmarks

LanguageFrameworkReq/sLatencyCold StartMemoryBest For
RustActix-web~150k<1msN/A2-5MBMaximum throughput
RustAxum~140k<1msN/A2-5MBErgonomics + performance
GoGin~100k+1-2msN/A5-10MBMature ecosystem
TypeScriptHono~50k<5ms<5ms128MBEdge deployment
PythonFastAPI~40k5-10ms1-2s30-50MBDeveloper experience
TypeScriptExpress~15k10-20ms1-3s50-100MBLegacy systems

Notes:

  • Benchmarks assume single-core, JSON responses
  • Actual performance varies with workload complexity
  • Cold start only applies to serverless/edge deployments

Pagination Strategies

Advantages: Handles real-time changes, no skipped/duplicate records, scales to billions

FastAPI Example:

python
@app.get("/items")
async def list_items(cursor: Optional[str] = None, limit: int = 20):
    query = db.query(Item).filter(Item.id > cursor) if cursor else db.query(Item)
    items = query.limit(limit).all()
    return {
        "items": items,
        "next_cursor": items[-1].id if items else None,
        "has_more": len(items) == limit
    }
Offset-Based (Simple Cases Only)

Use only for static datasets (<10k records) with direct page access needs.

See references/pagination-patterns.md for complete patterns and frontend integration.

OpenAPI Documentation

FrameworkOpenAPI SupportDocs UIConfiguration
FastAPIAutomaticSwagger UI + ReDocBuilt-in
HonoMiddleware pluginSwagger UI@hono/swagger-ui
Axumutoipa crateSwagger UIManual annotations
Ginswaggo/swagSwagger UIComment annotations

FastAPI Example (Zero Config):

python
app = FastAPI(title="My API", version="1.0.0")

@app.post("/items", tags=["items"])
async def create_item(item: Item) -> Item:
    """Create item with name and price"""
    return item
# Docs at /docs, /redoc, /openapi.json

See references/openapi-documentation.md for framework-specific setup. Use scripts/generate_openapi.py to extract specs programmatically.

Frontend Integration Patterns

Forms → REST POST/PUT

Backend:

python
class UserCreate(BaseModel):
    email: EmailStr; name: str; age: int

@app.post("/api/users", status_code=201)
async def create_user(user: UserCreate):
    return {"id": 1, **user.dict()}

Frontend:

typescript
const res = await fetch('/api/users', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify(data)
})
if (!res.ok) throw new Error((await res.json()).detail)
Tables → GET with Pagination

See cursor pagination example above and references/pagination-patterns.md.

AI Chat → SSE Streaming

Backend:

python
from sse_starlette.sse import EventSourceResponse

@app.post("/api/chat")
async def chat(message: str):
    async def gen():
        for chunk in llm_stream(message):
            yield {"event": "message", "data": chunk}
    return EventSourceResponse(gen())

Frontend:

typescript
const es = new EventSource('/api/chat')
es.addEventListener('message', (e) => appendToChat(e.data))

See examples/ for complete integration examples with each frontend skill.

Rate Limiting

FastAPI Example (Token Bucket):

python
from slowapi import Limiter
from slowapi.util import get_remote_address

limiter = Limiter(key_func=get_remote_address)
app.state.limiter = limiter

@app.get("/items")
@limiter.limit("100/minute")
async def list_items():
    return {"items": []}

See references/rate-limiting-strategies.md for sliding window, distributed patterns, and Redis implementation.

Show full SKILL.md (291 more words)Show less

GraphQL Libraries

Use when frontend needs flexible data fetching or mobile apps have bandwidth constraints.

By Language:

  • Python: Strawberry 0.287 (type-hint-based, async)
  • Rust: async-graphql (high performance, tokio)
  • Go: gqlgen (code generation from schema)
  • TypeScript: Pothos (type-safe builder, no codegen)

See references/graphql-schema-design.md for schema patterns and N+1 prevention. See examples/graphql-strawberry/ for complete Python example.

gRPC for Microservices

Use for service-to-service communication with strong typing and high performance.

By Language:

  • Rust: Tonic (async, type-safe, code generation)
  • Go: Connect-Go (gRPC-compatible + browser-friendly)
  • Python: grpcio (official implementation)
  • TypeScript: @connectrpc/connect (browser + Node.js)

See references/grpc-protobuf-guide.md for Protocol Buffers guide. See examples/grpc-tonic/ for complete Rust example.

Additional Resources

References
  • references/rest-design-principles.md - REST resource modeling, HTTP methods, status codes
  • references/graphql-schema-design.md - Schema patterns, resolver optimization, N+1 prevention
  • references/grpc-protobuf-guide.md - Proto3 syntax, service definitions, streaming
  • references/trpc-setup-guide.md - Router patterns, middleware, Zod validation
  • references/pagination-patterns.md - Cursor vs offset with mathematical explanation
  • references/rate-limiting-strategies.md - Token bucket, sliding window, Redis
  • references/caching-patterns.md - HTTP caching, application caching strategies
  • references/versioning-strategies.md - URI, header, media type versioning
  • references/openapi-documentation.md - Swagger/OpenAPI best practices by framework
Scripts (Token-Free Execution)
  • scripts/generate_openapi.py - Generate OpenAPI spec from code
  • scripts/validate_api_spec.py - Validate OpenAPI 3.1 compliance
  • scripts/benchmark_endpoints.py - Load test API endpoints
Examples
  • examples/python-fastapi/ - Complete FastAPI REST API
  • examples/typescript-hono/ - Hono edge-first API
  • examples/typescript-trpc/ - tRPC E2E type-safe API
  • examples/rust-axum/ - Axum REST API
  • examples/go-gin/ - Gin REST API
  • examples/graphql-strawberry/ - Python GraphQL
  • examples/grpc-tonic/ - Rust gRPC

Quick Reference

Choose REST when: Public API, standard CRUD, need caching, OpenAPI docs required Choose GraphQL when: Frontend needs flexible queries, mobile bandwidth constraints, complex nested data Choose gRPC when: Service-to-service communication, high performance, bidirectional streaming Choose tRPC when: TypeScript full-stack, same team owns frontend + backend, E2E type safety

Pagination: Always use cursor-based for production scale, offset-based only for simple cases Documentation: Prefer frameworks with automatic OpenAPI generation (FastAPI, Hono) Performance: Rust (Axum) for max throughput, Go (Gin) for maturity, Python (FastAPI) for DX

© ancoleman, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 26 other files (scripts, references) in skills/implementing-api-patterns of ancoleman/ai-design-components.

  • SKILL.md
  • README.md
  • examples/go-gin/README.md
  • examples/graphql-strawberry/README.md
  • examples/grpc-tonic/README.md
  • examples/python-fastapi/README.md
  • examples/python-fastapi/main.py
  • examples/python-fastapi/requirements.txt
  • examples/rust-axum/README.md
  • examples/typescript-hono/index.ts
  • examples/typescript-hono/package.json
  • examples/typescript-trpc/README.md
  • outputs.yaml
  • … and 14 more

Open the folder on GitHubat commit 76551b7

Used in 1 other repository

We found 3 copies of this SKILL.md (exact, near-identical or edited) in other folders, from 1 other GitHub owner. This page covers the copy in ancoleman/ai-design-components, which our catalogue first saw on October 7, 2026.

Compare with similar skills

Implementing API Patterns next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Implementing API Patterns compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Implementing API Patterns this skillancoleman/ai-design-components5261 repos~3kAutomated safety check: PassMIT
API Designericrisco/rsc-harness156—~3.1kAutomated safety check: PassMIT
API ForgeEliasOulkadi/shokunin114—~2.9kAutomated safety check: PassMIT
API Architectcuriositech/some_claude_skills2431 repos~1.4kAutomated safety check: PassMIT
API Client Generatorrevfactory/harness-1001.3k—~1.6kAutomated safety check: PassApache-2.0
SpikardGoldziher/spikard123—~799Automated safety check: PassMIT

Similar skills

  • API Design

    ericrisco/rsc-harness

    A skill your agent uses when settling the contract of an API you expose, before implementation: resources/URLs, REST vs GraphQL, versioning, one RFC 9457 error envelope, pagination, idempotency —…

    156 GitHub stars~3.1k tokensUpdated today
    Backend & APIsAuto-check passed
  • API Forge

    EliasOulkadi/shokunin

    Design REST/GraphQL APIs with OpenAPI 3.1, error handling, pagination, rate limiting, webhooks, and idempotency.

    114 GitHub stars~2.9k tokensUpdated 2 days ago
    Backend & APIsAuto-check passed
  • API Architect

    curiositech/some_claude_skills

    Expert API designer for REST, GraphQL, gRPC architectures. An agent skill from curiositech/some_claude_skills.

    243 GitHub starsUsed in 1 repo~1.4k tokens
    Backend & APIsAuto-check passed
  • API Client Generator

    revfactory/harness-100

    Full pipeline for auto-generating API client SDKs. An agent skill from revfactory/harness-100.

    1.3k GitHub stars~1.6k tokensUpdated 6 mo ago
    Backend & APIsAuto-check passed
  • Spikard

    Goldziher/spikard

    Scaffold Spikard projects and generate code from OpenAPI, AsyncAPI, OpenRPC, GraphQL, and Protobuf schemas using the Spikard CLI or its MCP server.

    123 GitHub stars~799 tokensUpdated 4 days ago
    Backend & APIsAuto-check passed
  • Uxc

    holon-run/uxc

    Discover and call remote schema-exposed interfaces with UXC.

    115 GitHub stars~1.8k tokensUpdated 22 days ago
    Backend & APIsAuto-check passed

More from ancoleman/ai-design-components

All 75 skills in this repo
  • Building AI Chat

    ancoleman/ai-design-components

    Builds AI chat interfaces and conversational UI with streaming responses, context management, and multi-modal support.

    526 GitHub starsUsed in 1 repo~3.4k tokens
    Auto-check passed
  • Building Forms

    ancoleman/ai-design-components

    Builds form components and data collection interfaces including contact forms, registration flows, checkout processes, surveys, and settings pages.

    526 GitHub stars~3.7k tokensUpdated 10 mo ago
    Auto-check passed
  • Building Tables

    ancoleman/ai-design-components

    Builds tables and data grids for displaying tabular information, from simple HTML tables to complex enterprise data grids.

    526 GitHub stars~1.8k tokensUpdated 10 mo ago
    Auto-check passed
  • Creating Dashboards

    ancoleman/ai-design-components

    Creates comprehensive dashboard and analytics interfaces that combine data visualization, KPI cards, real-time updates, and interactive layouts.

    526 GitHub stars~3.5k tokensUpdated 10 mo ago
    Auto-check passed
  • Designing Layouts

    ancoleman/ai-design-components

    Designs layout systems and responsive interfaces including grid systems, flexbox patterns, sidebar layouts, and responsive breakpoints.

    526 GitHub stars~1.7k tokensUpdated 10 mo ago
    Auto-check passed
  • Displaying Timelines

    ancoleman/ai-design-components

    Displays chronological events and activity through timelines, activity feeds, Gantt charts, and calendar interfaces.

    526 GitHub stars~2.7k tokensUpdated 10 mo ago
    Auto-check passed

Categories

Questions about Implementing API Patterns

What does Implementing API Patterns do?

API design and implementation across REST, GraphQL, gRPC, and tRPC patterns. Implementing API Patterns is an agent skill from ancoleman/ai-design-components. API design and implementation across REST, GraphQL, gRPC, and tRPC patterns.

When should I use Implementing API Patterns?

Implementing API Patterns fits situations like: building backend services; service-to-service communication.

How do I install Implementing API Patterns in Claude Code?

Run `npx skills add ancoleman/ai-design-components --skill implementing-api-patterns -a claude-code`. Or copy the skill folder (skills/implementing-api-patterns in ancoleman/ai-design-components) into .claude/skills/implementing-api-patterns in your project. Claude Code loads it when a task matches its description.

How do I install Implementing API Patterns in Codex?

Run `npx skills add ancoleman/ai-design-components --skill implementing-api-patterns -a codex`. Or copy the skill folder (skills/implementing-api-patterns in ancoleman/ai-design-components) into .agents/skills/implementing-api-patterns in your project. Codex loads it when a task matches its description.

Can I use Implementing API Patterns in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add ancoleman/ai-design-components --skill implementing-api-patterns -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/implementing-api-patterns, .gemini/skills/implementing-api-patterns, .github/skills/implementing-api-patterns and .opencode/skills/implementing-api-patterns in your project.

What does Implementing API Patterns need to run?

Going by SKILL.md and its folder, Implementing API Patterns needs Python and TypeScript for the scripts in its folder. Our summary lists: Python 3; Node.js.

Does Implementing API Patterns access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Implementing API Patterns safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. The check reads SKILL.md only: the scripts in the folder are not scanned, so read them before running anything.

What licence does Implementing API Patterns use?

Implementing API Patterns is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Implementing API Patterns use?

About 3k tokens (SKILL.md is roughly 12k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 31k tokens, read only when the agent opens those files.

What are the alternatives to Implementing API Patterns?

Skills that share tags, products or a category with Implementing API Patterns: API Design (ericrisco/rsc-harness, 156 stars), API Forge (EliasOulkadi/shokunin, 114 stars), API Architect (curiositech/some_claude_skills, 243 stars) and API Client Generator (revfactory/harness-100, 1.3k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Implementing API Patterns?

ancoleman (a GitHub user) maintains it in ancoleman/ai-design-components, which has 526 GitHub stars. The repository holds 75 skills in this directory. The repository was last updated on December 11, 2025.

Source: ancoleman/ai-design-components on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.