ZeroTool Workbench
OpenAPI → TypeScript 생성기
OpenAPI 3.0/3.1 스펙(YAML/JSON)을 브라우저에서 TypeScript 인터페이스로 변환. $ref, oneOf/allOf, enum, nullable 지원 및 Zod 스키마 동시 출력.
사용 방법
- OpenAPI 3.0.x 또는 3.1.x 문서(YAML 또는 JSON)를 왼쪽 패널에 붙여 넣습니다.
- 입력하면 300 ms 디바운스로 실시간 생성됩니다.
- 선택적으로 루트 네임스페이스 변경, 모든 속성을 optional 처리, path 오퍼레이션 타입 포함, Zod 스키마 동시 출력을 선택할 수 있습니다.
- 복사 버튼으로 전체 TypeScript 출력을 가져갑니다.
생성되는 내용
- components/schemas: 각 스키마가
export interface또는export type이 됩니다. 객체는 interface, 기본형 / 유니언 / enum / 교차 타입은 type alias로 출력됩니다. - $ref:
#/components/schemas/...참조는 타입 이름으로 해석되며, 스펙의 선언 순서를 그대로 따릅니다. - oneOf / anyOf: 유니언 타입
A | B | C. allOf는 교차 타입A & B. - enum: 문자열 또는 숫자 리터럴 유니언.
- nullable: 3.0의
nullable: true와 3.1의type: ['X', 'null']모두X | null로 변환. - format 힌트:
format: date-time에는 ISO 8601 JSDoc 주석을 추가하고,format: binary는Blob이 됩니다. - additionalProperties: 인덱스 시그니처 또는
Record<string, T>.
Path 타입(선택)
path 타입 포함을 켜면 각 오퍼레이션마다 타입 엔벨로프가 생성됩니다:
export namespace Components {
export namespace GetPetById {
export interface PathParameters {
id: number;
}
export type Response200 = Pet;
}
}
오퍼레이션에 operationId가 없으면 method와 path로 합성합니다(예: GetPetsId).
Zod 스키마(선택)
Zod 스키마 포함을 켜면 각 컴포넌트별로 XSchema를 함께 출력합니다:
import { z } from 'zod';
export const PetSchema = z.object({
id: z.number().int(),
name: z.string(),
status: z.enum(["available", "pending", "sold"]),
});
OpenAPI 스펙이 아니라 손으로 쓴 TS 타입에서 Zod를 만들고 싶다면 TypeScript → Zod를 사용하세요.
관련 도구
- OpenAPI 유효성 검사기 — 타입 생성 전 스펙을 검증.
- JSON → TypeScript — 스펙은 없고 JSON 응답 샘플만 있을 때.
- JSON → Zod 스키마 — 단일 JSON 예시에서 Zod 생성.
FAQ
어떤 OpenAPI 버전을 지원하나요?
3.0.x와 3.1.x 모두 지원합니다. OpenAPI 3.1의 `type: ['string', 'null']`은 `string | null`로, OpenAPI 3.0의 `nullable: true`도 동일하게 처리됩니다.
Swagger 2.0은 어떻게 되나요?
Swagger 2.0은 의도적으로 지원하지 않습니다. 먼저 editor.swagger.io(Swagger Editor 내장 변환기)에서 OpenAPI 3.x로 마이그레이션한 뒤 본 도구에 붙여 넣으세요.
원격 $ref도 해석되나요?
`#/components/schemas/...` 형식의 내부 참조만 해석합니다. 외부 URL이나 파일 경로의 $ref는 가져오지 않습니다. 외부 스키마는 먼저 인라인화하거나 openapi-typescript CLI를 사용하세요.
내 스펙이 서버로 전송되나요?
전혀 전송되지 않습니다. 파싱, $ref 해석, TypeScript 생성이 모두 브라우저에서 끝납니다. 백엔드도 없고 스펙 내용의 텔레메트리도 수집하지 않습니다.
Zod 스키마도 함께 받을 수 있나요?
네. **Zod 스키마 포함** 을 켜면 TypeScript 인터페이스와 함께 `z.object({...})` 정의를 출력합니다. 정적 타입과 일치하는 런타임 검증이 필요할 때 유용합니다.
'path 타입 포함'은 무엇을 하나요?
각 오퍼레이션마다 네임스페이스를 만들어 `PathParameters`, `QueryParameters`, `RequestBody`, `Response200` / `Response201` 등을 노출합니다. DTO 인터페이스만 필요하다면 끄세요.