UNPKG

swagger-fsd-gen

Version:

Swagger API client generator that creates type-safe API clients using ky and TanStack Query with Feature Sliced Design pattern. Automatically generates API client code from Swagger/OpenAPI specifications.

138 lines (99 loc) β€’ 2.86 kB
# πŸš€ Quick Start Guide ## πŸ“‹ μš”κ΅¬μ‚¬ν•­ - Node.js 18+ - Yarn 4.7.0+ ## πŸ”§ μ„€μΉ˜ ```bash # 1. μ €μž₯μ†Œ 클둠 git clone <your-repo-url> cd swagger-client-autogen # 2. μ˜μ‘΄μ„± μ„€μΉ˜ yarn install # 3. μ „μ—­ μ„€μΉ˜ (선택사항) yarn link ``` ## πŸ’‘ μ‚¬μš©λ²• ### 1단계: Swagger λ¬Έμ„œ λ‹€μš΄λ‘œλ“œ (선택사항) ```bash # 원격 Swagger λ¬Έμ„œλ₯Ό λ‘œμ»¬μ— μ €μž₯ fetch-swagger --url https://api.example.com/swagger.json # 인증이 ν•„μš”ν•œ 경우 fetch-swagger --url https://api.example.com/swagger.json --username admin --password secret ``` ### 2단계: API ν΄λΌμ΄μ–ΈνŠΈ 생성 ```bash # 원격 URLμ—μ„œ 직접 생성 generate-all --uri https://api.example.com/swagger.json # 둜컬 νŒŒμΌμ—μ„œ 생성 generate-all --uri ./swagger/my-api.yml # 인증이 ν•„μš”ν•œ 경우 generate-all --uri https://api.example.com/swagger.json --username admin --password secret ``` ## πŸ“ μƒμ„±λ˜λŠ” 파일 ``` src/ β”œβ”€β”€ shared/ β”‚ └── api/ β”‚ └── dto.ts # λͺ¨λ“  DTO νƒ€μž… └── entities/ └── {moduleName}/ # 각 Swagger νƒœκ·Έλ³„ └── api/ β”œβ”€β”€ index.ts # API 클래슀 β”œβ”€β”€ instance.ts # API μΈμŠ€ν„΄μŠ€ β”œβ”€β”€ queries.ts # Query ν›… └── mutations.ts # Mutation ν›… ``` ## 🎯 ν”„λ‘œμ νŠΈμ— μ μš©ν•˜κΈ° ### 1. ν•„μš”ν•œ νŒ¨ν‚€μ§€ μ„€μΉ˜ ```bash npm install ky @tanstack/react-query ``` ### 2. API μΈμŠ€ν„΄μŠ€ μ„€μ • ```typescript // src/app/providers/api.ts import ky from "ky"; export const apiInstance = ky.create({ prefixUrl: "https://api.example.com", headers: { "Content-Type": "application/json", }, }); ``` ### 3. μƒμ„±λœ μ½”λ“œ μ‚¬μš© ```typescript // Query μ‚¬μš© import { useGetUsersQuery } from "@/entities/user/api/queries"; const { data: users, isLoading } = useGetUsersQuery(); // Mutation μ‚¬μš© import { useCreateUserMutation } from "@/entities/user/api/mutations"; const createUser = useCreateUserMutation({ onSuccess: () => console.log("User created!"), }); createUser.mutate({ body: { name: "John" } }); ``` ## βš™οΈ μ»€μŠ€ν…€ μ„€μ • ```bash # 좜λ ₯ 경둜 μ»€μŠ€ν„°λ§ˆμ΄μ§• generate-all --uri ./swagger.json \ --dto-output-path ./src/types/api.ts \ --api-output-path ./src/api/{moduleName}/client.ts \ --query-output-path ./src/api/{moduleName}/queries.ts \ --mutation-output-path ./src/api/{moduleName}/mutations.ts # μ»€μŠ€ν…€ ν…œν”Œλ¦Ώ μ‚¬μš© generate-all --uri ./swagger.json --project-template ./my-templates/ ``` ## πŸ” 문제 ν•΄κ²° ### μ˜μ‘΄μ„± 였λ₯˜ ```bash yarn install ``` ### κΆŒν•œ 였λ₯˜ (μ „μ—­ μ„€μΉ˜ μ‹œ) ```bash yarn unlink yarn link ``` ### μƒμ„±λœ 파일 확인 ```bash # μƒμ„±λœ 파일 λͺ©λ‘ 확인 find src -name "*.ts" -type f | grep -E "(api|dto)" | sort ```