Claude CodeでAPIコンポジションを設計する:BFF・複数サービス集約・データ変換

はじめに 「フロントエンドが複数のマイクロサービスを直接叩いていてAPIコールが多い」——BFF(Backend for Frontend)でAPIコンポジションレイヤーを設け、複数サービスのデータを1つのAPIレスポンスに集約する設計をClaude Codeに生成させる。 CLAUDE.mdにAPIコンポジション設計ルールを書く ## APIコンポジション設計ルール ### コンポジション...

By · · 1 min read
Claude CodeでAPIコンポジションを設計する:BFF・複数サービス集約・データ変換

Source: DEV Community

はじめに 「フロントエンドが複数のマイクロサービスを直接叩いていてAPIコールが多い」——BFF(Backend for Frontend)でAPIコンポジションレイヤーを設け、複数サービスのデータを1つのAPIレスポンスに集約する設計をClaude Codeに生成させる。 CLAUDE.mdにAPIコンポジション設計ルールを書く ## APIコンポジション設計ルール ### コンポジション原則 - BFFが複数のダウンストリームサービスを並列で呼び出す - フロントエンドに必要なデータだけを返す(過剰データを除去) - エラーはサービス単位で分離(1サービス失敗でもレスポンスを返す) ### パフォーマンス - 独立したサービス呼び出しは常に並列実行(Promise.all) - 依存関係がある場合のみ逐次(例: userId取得後にそのユーザーの注文取得) - 結果をBFFレベルでキャッシュ(TTL: 30秒) ### データ変換 - ダウンストリームのレスポンスをBFFで変換(フロントの型に合わせる) - camelCase変換、フィールド名の統一、不要フィールドの除去 APIコンポジション実装の生成 BFF APIコンポジションを設計してください。 要件: - 複数サービスの並列呼び出し - 部分的な失敗の処理 - レスポンスデータ変換 - BFFキャッシュ 生成ファイル: src/bff/composition/ 生成されるAPIコンポジション実装 // src/bff/composition/composer.ts — APIコンポジションエンジン export interface DataSource<T> { name: string; fetch: () => Promise<T>; optional?: boolean; // true: 失敗してもレスポンスに含めない(エラーにしない) cacheTtlSec?: number; // BFFレベルキャッシュのTTL fallback?: () => T; // フォールバック値 } export type ComposedResult<T extends Record<string, DataSource<unknown>>&g