nicetool.dev logo

JSON을 TypeScript로

API 응답이나 JSON 객체를 붙여 넣으세요. 입력하는 대로 타입이 갱신됩니다.

JSON
생성된 코드
export interface User {
  id: number;
  name: string;
  email: string;
  score: number;
  active: boolean;
  tags: string[];
  address: Address;
  orders: Order[];
}

export interface Address {
  city: string;
  postcode: null;
}

export interface Order {
  id: number;
  total: number;
  paidAt?: string;
  coupon?: string;
}

JSON에서 타입을 생성하는 이유는?

API, 설정 파일, 웹훅은 JSON을 보내지만 TypeScript, Go, 런타임 검증기에는 명시적인 구조가 필요합니다. 큰 응답의 인터페이스를 손으로 쓰면 느리고 실수하기 쉽습니다. 가끔 빠지는 필드, 가끔 null이 되는 숫자, 중첩된 객체 배열은 특히 틀리기 쉽습니다. 이 도구는 실제 예시를 읽고 구조를 추론합니다. 객체 배열은 병합되어 일부 항목에만 있는 키는 선택적으로, 가끔 null인 키는 nullable로 바뀌고 중첩 객체마다 고유한 타입 이름이 붙습니다.

기능

  • • 선택적(?) 필드가 있는 TypeScript 인터페이스 또는 type 별칭
  • • json 태그, omitempty, Go 관례 이름(ID, URL)을 쓴 Go 구조체
  • • 추론된 TypeScript 타입이 포함된 Zod 스키마(참조 순서대로 정렬)
  • • 객체 배열 병합과 null, 혼합 값, 정수 감지
  • • "first-name"처럼 식별자로 쓸 수 없는 키는 따옴표 처리

데이터는 비공개로 유지

파싱과 코드 생성은 브라우저에서 실행됩니다. 실제 고객 데이터가 담긴 API 응답이 내 컴퓨터를 벗어나지 않습니다.

업로드 없음, 오프라인에서도 동작.

JSON을 TypeScript로 사용 방법

  1. 1

    JSON 예시를 붙여 넣으세요. 브라우저 Network 탭, Postman, curl에서 복사한 응답 등이 좋습니다. 배열 항목이 많을수록 선택적 필드를 더 정확히 감지합니다.

  2. 2

    출력을 고르세요. TypeScript 인터페이스, Go 구조체, Zod 스키마 중 선택하며 TypeScript는 type 별칭으로 바꿀 수 있습니다.

  3. 3

    User나 OrderResponse처럼 루트 타입 이름을 정하세요. 중첩 객체는 키 이름으로, 배열 항목은 단수형(orders는 Order)으로 이름이 붙습니다.

  4. 4

    결과를 검토하고 예시로는 알 수 없는 부분(실제로는 날짜나 열거형인 문자열 등)을 고친 뒤 코드에 복사하세요.

활용 예시

REST API 응답 타입 지정

GET /api/users/42의 JSON을 붙여 넣으면 중첩된 Address 타입을 가진 User 인터페이스가 생겨 fetch나 axios에 바로 쓸 수 있습니다.

외부 API용 Go 클라이언트

Stripe나 GitHub 웹훅 페이로드로 json 태그가 붙은 구조체를 만듭니다. 선택적 키에는 omitempty가 붙고 중첩 객체는 별도 타입이 됩니다.

Zod로 런타임 검증

요청 본문 예시를 Zod 스키마로 바꾸고 Next.js 라우트 핸들러에서 schema.parse()로 잘못된 입력을 거르며, 정적 타입에는 z.infer를 씁니다.

설정 파일

JSON 설정 파일을 붙여 넣어 타입이 있는 인터페이스를 만들면 에디터가 키를 자동 완성하고 오타를 잡아 줍니다.

자주 묻는 질문

선택적 필드는 어떻게 감지하나요?+

루트나 중첩 값이 객체 배열이면 모든 항목을 병합합니다. 하나 이상의 항목에 없는 키는 선택적(TypeScript의 ?, Go의 omitempty, Zod의 .optional())으로 표시됩니다.

null 값은 어떻게 처리되나요?+

어떤 항목에서는 null이고 다른 항목에서는 문자열인 키는 string | null(Zod의 nullable(), Go의 *string)이 됩니다. 예시에서 항상 null인 키는 실제 타입을 알 수 없어 null로 남습니다.

Go에서 숫자가 int64가 되는 이유는?+

예시의 정수는 int64, 소수는 float64가 됩니다. 둘이 섞인 필드는 float64(TypeScript에서는 number)로 넓힙니다.

날짜, 열거형, UUID를 감지할 수 있나요?+

아니요. JSON에는 날짜나 열거형 타입이 없어 string으로 나옵니다. z.string().datetime()이나 리터럴 값의 유니언 등으로 직접 다듬으세요.