.agents/skills/api-patterns/SKILL.md
API design principles and decision-making. REST vs GraphQL vs tRPC selection, response formats, versioning, pagination.
npx skillsauth add baotoq/micro-commerce api-patternsInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
API design principles and decision-making for 2025. Learn to THINK, not copy fixed patterns.
Read ONLY files relevant to the request! Check the content map, find what you need.
| File | Description | When to Read |
|------|-------------|--------------|
| api-style.md | REST vs GraphQL vs tRPC decision tree | Choosing API type |
| rest.md | Resource naming, HTTP methods, status codes | Designing REST API |
| response.md | Envelope pattern, error format, pagination | Response structure |
| graphql.md | Schema design, when to use, security | Considering GraphQL |
| trpc.md | TypeScript monorepo, type safety | TS fullstack projects |
| versioning.md | URI/Header/Query versioning | API evolution planning |
| auth.md | JWT, OAuth, Passkey, API Keys | Auth pattern selection |
| rate-limiting.md | Token bucket, sliding window | API protection |
| documentation.md | OpenAPI/Swagger best practices | Documentation |
| security-testing.md | OWASP API Top 10, auth/authz testing | Security audits |
| Need | Skill |
|------|-------|
| API implementation | @[skills/backend-development] |
| Data structure | @[skills/database-design] |
| Security details | @[skills/security-hardening] |
Before designing an API:
DON'T:
DO:
| Script | Purpose | Command |
|--------|---------|---------|
| scripts/api_validator.py | API endpoint validation | python scripts/api_validator.py <project_path> |
development
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.
development
React composition patterns that scale. Use when refactoring components with boolean prop proliferation, building flexible component libraries, or designing reusable APIs. Triggers on tasks involving compound components, render props, context providers, or component architecture. Includes React 19 API changes.
testing
Generate comprehensive, maintainable unit tests across languages with strong coverage and edge case focus.
tools
UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient. Integrations: shadcn/ui MCP for component search and examples.