Claude Code के साथ OpenAPI/Swagger API Practical Guide

OpenAPI/Swagger定義को Claude Code से Efficient बनाएं

API設計ファーストのアプローチでは、implementationपहलेにOpenAPI仕様を定義し है।Claude Code का उपयोग करके、包括的なAPI仕様書のcreate सेclientcodegenerate तक一気に進められ है।

OpenAPI仕様のcreate

RESTful APIの定義

> ブlogAPIのOpenAPI 3.1仕様をबनाओ。
> 記事のCRUD、タグmanagement、authenticationを含めて。

openapi: 3.1.0
info:
  title: Blog API
  version: 1.0.0
  description: ブlogmanagement用REST API

servers:
  - url: https://api.example.com/v1
    description: 本番環境

paths:
  /posts:
    get:
      summary: 記事listのfetch
      operationId: listPosts
      tags: [posts]
      parameters:
        - $ref: '#/components/parameters/PageParam'
        - $ref: '#/components/parameters/LimitParam'
        - name: tag
          in: query
          schema:
            type: string
          description: タグでfilter
      responses:
        '200':
          description: 記事list
          content:
            application/json:
              schema:
                type: object
                properties:
                  data:
                    type: array
                    items:
                      $ref: '#/components/schemas/Post'
                  meta:
                    $ref: '#/components/schemas/Pagination'
    post:
      summary: 記事のcreate
      operationId: createPost
      tags: [posts]
      security:
        - bearerAuth: []
      requestBody:
        required: true
        content:
          application/json:
            schema:
              $ref: '#/components/schemas/CreatePostRequest'
      responses:
        '201':
          description: create成功
          content:
            application/json:
              schema:
                $ref: '#/components/schemas/Post'
        '400':
          $ref: '#/components/responses/BadRequest'
        '401':
          $ref: '#/components/responses/Unauthorized'

components:
  schemas:
    Post:
      type: object
      required: [id, title, content, createdAt]
      properties:
        id:
          type: string
          format: uuid
        title:
          type: string
          maxLength: 200
        content:
          type: string
        tags:
          type: array
          items:
            type: string
        createdAt:
          type: string
          format: date-time
        updatedAt:
          type: string
          format: date-time

    CreatePostRequest:
      type: object
      required: [title, content]
      properties:
        title:
          type: string
          minLength: 1
          maxLength: 200
        content:
          type: string
          minLength: 1
        tags:
          type: array
          items:
            type: string

    Pagination:
      type: object
      properties:
        currentPage:
          type: integer
        totalPages:
          type: integer
        totalItems:
          type: integer

  securitySchemes:
    bearerAuth:
      type: http
      scheme: bearer
      bearerFormat: JWT

codegenerate

TypeScript型とclientの自動generate

> OpenAPI定義 सेTypeScriptのtype definitionsとAPIclient generateして。
> openapi-typescriptका उपयोग करके。

// generateされた型を使ったAPIclient
import type { paths } from './generated/api';
import createClient from 'openapi-fetch';

const client = createClient<paths>({
  baseUrl: 'https://api.example.com/v1',
});

// 型safeなAPI呼び出し
const { data, error } = await client.GET('/posts', {
  params: {
    query: { page: 1, limit: 10, tag: 'typescript' },
  },
});

validationintegration

OpenAPI定義をruntimevalidationにutilizationする बातで、仕様とimplementationの乖離を防げ है।

> OpenAPI定義 सेZodスkeyマ generateして。
> request・responseの両方をvalidationして。

モックserver

OpenAPI定義 सेモックserverを立ちऊपरげ、フロントエンドdevelopmentを並行して進められ है।Claude Codeに「Prismでモックserverを起動するsettingsを作って」と依頼すれば、即座に利用possible है।

Summary

Claude Code का उपयोग करके、OpenAPI仕様のcreate सेcodegenerate、validationintegration तक一貫したAPIdevelopmentworkflow build किया जा सकता है。APIdevelopmentガイドやAPItestautomationも合わせてreference के लिए देखें。

OpenAPIके details के लिएOpenAPI InitiativeおよびSwaggerofficial documentationをदेखें。