Code Patterns Reference
This skill contains comprehensive patterns for modern development. Reference files are organized by topic.
Quick Reference
| Topic |
Key Patterns |
When to Use |
| API Design |
REST, GraphQL, OpenAPI |
Designing/implementing APIs |
| Testing |
pytest, vitest, mocking |
Writing tests |
| Docker |
Multi-stage, Compose |
Containerizing apps |
| CI/CD |
GitHub Actions, pipelines |
Setting up automation |
| Database |
PostgreSQL, migrations |
Database design |
| TypeScript |
Types, generics, patterns |
TS development |
| Python |
async, patterns, uv |
Python development |
| React/Next.js |
Server Components, hooks |
Frontend development |
Reference Files
api.md - REST, GraphQL, authentication, pagination
testing.md - pytest, vitest, mocking, coverage
docker.md - Dockerfiles, Compose, production
ci-cd.md - GitHub Actions, deployment
database.md - PostgreSQL, migrations, queries
typescript.md - Types, generics, advanced patterns
python.md - async, patterns, best practices
react.md - Server Components, hooks, Next.js
API Design Quick Reference
REST Endpoints
GET /resources List
GET /resources/{id} Get one
POST /resources Create
PUT /resources/{id} Replace
PATCH /resources/{id} Update
DELETE /resources/{id} Delete
HTTP Status Codes
| Code |
Meaning |
| 200 |
OK |
| 201 |
Created |
| 204 |
No Content |
| 400 |
Bad Request |
| 401 |
Unauthorized |
| 403 |
Forbidden |
| 404 |
Not Found |
| 422 |
Unprocessable |
| 429 |
Rate Limited |
| 500 |
Server Error |
Testing Quick Reference
pytest
@pytest.fixture
def client():
return TestClient(app)
def test_endpoint(client):
response = client.get("/api/users")
assert response.status_code == 200
vitest
import { describe, it, expect, vi } from 'vitest';
describe('Component', () => {
it('should work', () => {
expect(true).toBe(true);
});
});
Docker Quick Reference
Multi-Stage Build
FROM node:20-alpine AS builder
WORKDIR /app
COPY package*.json ./
RUN npm ci
COPY . .
RUN npm run build
FROM node:20-alpine
COPY --from=builder /app/dist ./dist
USER node
CMD ["node", "dist/index.js"]
Compose
services:
app:
build: .
ports:
- "3000:3000"
depends_on:
db:
condition: service_healthy
db:
image: postgres:16-alpine
healthcheck:
test: ["CMD", "pg_isready"]
CI/CD Quick Reference
GitHub Actions
name: CI
on: [push, pull_request]
jobs:
test:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- uses: actions/setup-node@v4
- run: npm ci
- run: npm test
TypeScript Quick Reference
Utility Types
Partial<T> // All properties optional
Required<T> // All properties required
Pick<T, K> // Select properties
Omit<T, K> // Exclude properties
Record<K, V> // Object with key type K, value type V
Generics
function first<T>(arr: T[]): T | undefined {
return arr[0];
}
Python Quick Reference
Async
async def fetch_data():
async with aiohttp.ClientSession() as session:
async with session.get(url) as response:
return await response.json()
Type Hints
def process(items: list[str]) -> dict[str, int]:
return {item: len(item) for item in items}
React/Next.js Quick Reference
Server Component (default)
// app/page.tsx
async function Page() {
const data = await fetch('...');
return <div>{data}</div>;
}
Client Component
'use client';
import { useState } from 'react';
export function Counter() {
const [count, setCount] = useState(0);
return <button => setCount(c => c + 1)}>{count}</button>;
}
1---2name: code-patterns3description: Reference patterns for REST APIs, pytest/vitest testing, Docker multi-stage builds, GitHub Actions CI/CD, PostgreSQL, TypeScript generics, Python async, and React Server Components. MUST BE USED when user asks about: "API design", "how to test", "Dockerfile", "CI/CD pipeline", "database schema", "TypeScript types", "async/await", "React hooks", "Next.js", "FastAPI", "testing pattern", "mock", "fixture", "docker compose", "github actions", "workflow yaml", "postgres query", "SQL pattern", "migration", "generic type", "server component", "use client", "use server", "middleware pattern", "error handling pattern", "retry logic". Includes code examples and validation commands. NOT for running tests (use smart-test-runner), security patterns (use security-audit), or git operations (use commit-message).4---56# Code Patterns Reference78This skill contains comprehensive patterns for modern development. Reference files are organized by topic.910## Quick Reference1112| Topic | Key Patterns | When to Use |13|-------|--------------|-------------|14| API Design | REST, GraphQL, OpenAPI | Designing/implementing APIs |15| Testing | pytest, vitest, mocking | Writing tests |16| Docker | Multi-stage, Compose | Containerizing apps |17| CI/CD | GitHub Actions, pipelines | Setting up automation |18| Database | PostgreSQL, migrations | Database design |19| TypeScript | Types, generics, patterns | TS development |20| Python | async, patterns, uv | Python development |21| React/Next.js | Server Components, hooks | Frontend development |2223## Reference Files2425- `api.md` - REST, GraphQL, authentication, pagination26- `testing.md` - pytest, vitest, mocking, coverage27- `docker.md` - Dockerfiles, Compose, production28- `ci-cd.md` - GitHub Actions, deployment29- `database.md` - PostgreSQL, migrations, queries30- `typescript.md` - Types, generics, advanced patterns31- `python.md` - async, patterns, best practices32- `react.md` - Server Components, hooks, Next.js3334---3536## API Design Quick Reference3738### REST Endpoints39```40GET /resources List41GET /resources/{id} Get one42POST /resources Create43PUT /resources/{id} Replace44PATCH /resources/{id} Update45DELETE /resources/{id} Delete46```4748### HTTP Status Codes49| Code | Meaning |50|------|---------|51| 200 | OK |52| 201 | Created |53| 204 | No Content |54| 400 | Bad Request |55| 401 | Unauthorized |56| 403 | Forbidden |57| 404 | Not Found |58| 422 | Unprocessable |59| 429 | Rate Limited |60| 500 | Server Error |6162---6364## Testing Quick Reference6566### pytest67```python68@pytest.fixture69def client():70 return TestClient(app)7172def test_endpoint(client):73 response = client.get("/api/users")74 assert response.status_code == 20075```7677### vitest78```typescript79import { describe, it, expect, vi } from 'vitest';8081describe('Component', () => {82 it('should work', () => {83 expect(true).toBe(true);84 });85});86```8788---8990## Docker Quick Reference9192### Multi-Stage Build93```dockerfile94FROM node:20-alpine AS builder95WORKDIR /app96COPY package*.json ./97RUN npm ci98COPY . .99RUN npm run build100101FROM node:20-alpine102COPY --from=builder /app/dist ./dist103USER node104CMD ["node", "dist/index.js"]105```106107### Compose108```yaml109services:110 app:111 build: .112 ports:113 - "3000:3000"114 depends_on:115 db:116 condition: service_healthy117 db:118 image: postgres:16-alpine119 healthcheck:120 test: ["CMD", "pg_isready"]121```122123---124125## CI/CD Quick Reference126127### GitHub Actions128```yaml129name: CI130on: [push, pull_request]131jobs:132 test:133 runs-on: ubuntu-latest134 steps:135 - uses: actions/checkout@v4136 - uses: actions/setup-node@v4137 - run: npm ci138 - run: npm test139```140141---142143## TypeScript Quick Reference144145### Utility Types146```typescript147Partial<T> // All properties optional148Required<T> // All properties required149Pick<T, K> // Select properties150Omit<T, K> // Exclude properties151Record<K, V> // Object with key type K, value type V152```153154### Generics155```typescript156function first<T>(arr: T[]): T | undefined {157 return arr[0];158}159```160161---162163## Python Quick Reference164165### Async166```python167async def fetch_data():168 async with aiohttp.ClientSession() as session:169 async with session.get(url) as response:170 return await response.json()171```172173### Type Hints174```python175def process(items: list[str]) -> dict[str, int]:176 return {item: len(item) for item in items}177```178179---180181## React/Next.js Quick Reference182183### Server Component (default)184```tsx185// app/page.tsx186async function Page() {187 const data = await fetch('...');188 return <div>{data}</div>;189}190```191192### Client Component193```tsx194'use client';195import { useState } from 'react';196197export function Counter() {198 const [count, setCount] = useState(0);199 return <button onClick={() => setCount(c => c + 1)}>{count}</button>;200}201```