Back to list
popup-studio-ai

phase-4-api

by popup-studio-ai

bkit Vibecoding Kit - PDCA methodology + Claude Code mastery for AI-native development

23🍴 10📅 Jan 24, 2026

SKILL.md


name: phase-4-api description: | Skill for designing and implementing backend APIs. Includes Zero Script QA methodology for validating APIs without test scripts.

Use proactively when user needs to design or implement backend APIs.

Triggers: API design, REST API, backend, endpoint, API 설계, API設計, API设计

Do NOT use for: frontend-only projects, static websites, or Starter level projects. hooks: Stop: - hooks: - type: command command: "node ${CLAUDE_PLUGIN_ROOT}/scripts/phase4-api-stop.js" agent: qa-monitor allowed-tools:

  • Read
  • Write
  • Edit
  • Glob
  • Grep
  • Bash user-invocable: false

Phase 4: API Design/Implementation + Zero Script QA

Backend API implementation and script-free QA

Purpose

Implement backend APIs that can store and retrieve data. Validate with structured logs instead of test scripts.

What to Do in This Phase

  1. API Design: Define endpoints, requests/responses
  2. API Implementation: Write actual backend code
  3. Zero Script QA: Log-based validation

Deliverables

docs/02-design/
└── api-spec.md             # API specification

src/api/                    # API implementation
├── routes/
├── controllers/
└── services/

docs/03-analysis/
└── api-qa.md               # QA results

PDCA Application

  • Plan: Define required API list
  • Design: Design endpoints, requests/responses
  • Do: Implement APIs
  • Check: Validate with Zero Script QA
  • Act: Fix bugs and proceed to Phase 5

Level-wise Application

LevelApplication Method
StarterSkip this Phase (no API)
DynamicUse bkend.ai BaaS
EnterpriseImplement APIs directly

What is Zero Script QA?

Instead of writing test scripts, validate with structured debug logs

[API] POST /api/users
[INPUT] { "email": "test@test.com", "name": "Test" }
[PROCESS] Email duplicate check → Passed
[PROCESS] Password hash → Complete
[PROCESS] DB save → Success
[OUTPUT] { "id": 1, "email": "test@test.com" }
[RESULT] ✅ Success

Advantages:
- Save test code writing time
- See actual behavior with your eyes
- Easy debugging

RESTful API Principles

What is REST?

REpresentational State Transfer - an architecture style for designing web services.

6 Core Principles

PrincipleDescriptionExample
1. Client-ServerSeparation of concerns between client and serverUI ↔ Data storage separated
2. StatelessEach request is independent, server doesn't store client stateAuth token included with each request
3. CacheableResponses must indicate if cacheableCache-Control header
4. Uniform InterfaceInteract through consistent interfaceDetailed below
5. Layered SystemAllow layered system architectureLoad balancer, proxy
6. Code on Demand(Optional) Server can send code to clientJavaScript delivery

Uniform Interface Details

The core of RESTful APIs is a uniform interface.

1. Resource-Based URLs

✅ Good (nouns, plural)
GET    /users          # User list
GET    /users/123      # Specific user
POST   /users          # Create user
PUT    /users/123      # Update user
DELETE /users/123      # Delete user

❌ Bad (using verbs)
GET    /getUsers
POST   /createUser
POST   /deleteUser/123

2. HTTP Method Meanings

MethodPurposeIdempotentSafe
GETRead
POSTCreate
PUTFull update
PATCHPartial update
DELETEDelete

Idempotent: Same result even if requested multiple times Safe: Doesn't change server state

3. HTTP Status Codes

2xx Success
├── 200 OK              # Success (read, update)
├── 201 Created         # Creation success
└── 204 No Content      # Success but no response body (delete)

4xx Client Error
├── 400 Bad Request     # Invalid request (validation failure)
├── 401 Unauthorized    # Authentication required
├── 403 Forbidden       # No permission
├── 404 Not Found       # Resource not found
└── 409 Conflict        # Conflict (duplicate, etc.)

5xx Server Error
├── 500 Internal Error  # Internal server error
└── 503 Service Unavailable  # Service unavailable

4. Consistent Response Format

// Success response
{
  "data": {
    "id": 123,
    "email": "user@example.com",
    "name": "John Doe"
  },
  "meta": {
    "timestamp": "2026-01-08T10:00:00Z"
  }
}

// Error response
{
  "error": {
    "code": "VALIDATION_ERROR",
    "message": "Email format is invalid.",
    "details": [
      { "field": "email", "message": "Please enter a valid email" }
    ]
  }
}

// List response (pagination)
{
  "data": [...],
  "pagination": {
    "page": 1,
    "limit": 20,
    "total": 100,
    "totalPages": 5
  }
}

URL Design Rules

1. Use lowercase
   ✅ /users/123/orders
   ❌ /Users/123/Orders

2. Use hyphens (-), avoid underscores (_)
   ✅ /user-profiles
   ❌ /user_profiles

3. Express hierarchical relationships
   ✅ /users/123/orders/456

4. Filtering via query parameters
   ✅ /users?status=active&sort=created_at
   ❌ /users/active/sort/created_at

5. Version management
   ✅ /api/v1/users
   ✅ Header: Accept: application/vnd.api+json;version=1

API Documentation Tools

ToolFeatures
OpenAPI (Swagger)Industry standard, auto documentation
PostmanTesting + documentation
InsomniaLightweight API client

API Design Checklist

  • RESTful Principles Compliance
    • Resource-based URLs (nouns, plural)
    • Appropriate HTTP methods
    • Correct status codes
  • Unified error response format
  • Authentication/authorization method defined
  • Pagination method defined
  • Versioning method (optional)

Templates

  • templates/pipeline/phase-4-api.template.md
  • templates/pipeline/zero-script-qa.template.md

Next Phase

Phase 5: Design System → APIs are ready, now build UI components

Score

Total Score

70/100

Based on repository quality metrics

SKILL.md

SKILL.mdファイルが含まれている

+20
LICENSE

ライセンスが設定されている

+10
説明文

100文字以上の説明がある

0/10
人気

GitHub Stars 100以上

0/15
最近の活動

1ヶ月以内に更新

+10
フォーク

10回以上フォークされている

+5
Issue管理

オープンIssueが50未満

+5
言語

プログラミング言語が設定されている

+5
タグ

1つ以上のタグが設定されている

+5

Reviews

💬

Reviews coming soon