JSON to TypeScript

신규

JSON 샘플에서 중첩 타입이 포함된 TypeScript 인터페이스 생성.

Output

Root name

JSON input

TypeScript output

Runs entirely in your browser. Nothing is uploaded.

클릭 한 번으로 JSON을 TypeScript로 변환

이 JSON to TypeScript 변환기는 JSON 샘플에서 바로 사용 가능한 인터페이스, 타입 또는 클래스를 생성하므로 API 응답을 위한 타입을 직접 작성할 필요가 없습니다. 왼쪽에 페이로드를 붙여 넣으면 오른쪽에 깔끔하게 정렬된 TypeScript가 즉시 나타납니다 — 복사하거나 .ts 파일로 다운로드하세요.

설치나 회원가입이 필요 없는 빠르고 무료인 대안입니다. JSON to TypeScript 인터페이스 변환이 한 단계로 완료되며, 중첩 객체, 배열, 유니온 타입이 모두 자동으로 추론됩니다. 파일 크기 제한 없음, 일일 사용 제한 없음, 데이터는 기기 밖으로 나가지 않습니다.

인터페이스, 타입 또는 클래스 — 당신이 선택

출력 토글을 사용해 interface, type 별칭 또는 class 중에서 전환할 수 있습니다. 인터페이스 모드가 기본값으로 export interface Root { … }를 출력하며, 타입 모드는 별칭을 선호하는 코드베이스를 위해 export type Root = { … }를 생성하고, 클래스 모드는 export class에 필드를 선언합니다. 동일한 JSON으로 세 가지를 모두 구동하므로 자신의 데이터로 몇 초 안에 비교할 수 있습니다.

루트 이름을 바꾸거나 export 키워드를 켜고 끌 수 있으며, 선택한 설정은 다음 번을 위해 기억됩니다 — 이 도구를 단일 형식 변환기가 아닌 유연한 TypeScript 타입 생성기로 만들어 줍니다.

중첩 객체, 배열, 유니온 타입의 스마트 추론

엔진은 JSON을 탐색하여 각 객체에 대한 명명된 인터페이스를 구축하고, 중첩된 인터페이스는 키 이름에서 따와 명명하며, 배열 요소는 단수화됩니다 — orders 배열은 Order[]가 됩니다. 동일한 형태는 하나의 인터페이스로 중복 제거되고, 혼합 타입 배열은 (string | number)[]와 같은 유니온으로 축소됩니다.

열거형 감지를 켜면 반복되는 문자열 값이 리터럴 유니온 타입으로 추론됩니다 — "shipped"와 "pending"이 있는 상태 열은 일반 string 대신 "pending" | "shipped"가 됩니다. 이 정밀함이 출력을 수작업으로 작성한 것처럼 느끼게 합니다.

선택적, null, readonly 필드의 올바른 처리

실제 API 데이터는 불완전한 경우가 많아, 변환기는 이를 정직하게 처리합니다. API 응답을 TypeScript로 변환할 때, 배열의 일부 항목에만 나타나는 키는 ?로 선택적으로 표시되고, null 처리 방법도 선택할 수 있습니다: 명시적인 | null 유니온으로 유지하거나, null → 선택적을 활성화하여 zip: string | null을 zip?: string으로 변환하세요.

readonly 토글은 불변 모델을 위해 모든 속성에 readonly 수정자를 붙입니다. 이 옵션들을 함께 사용하면 생성된 JSON TypeScript 타입을 수동으로 수정할 필요 없이 프로젝트 규칙에 맞출 수 있습니다.

quicktype, json2ts, MakeTypes와의 비교

quicktype.io는 다국어 생성에 가장 완성도 높은 옵션으로 TypeScript 외에도 Python, Go, C#, Kotlin 등 다양한 언어를 지원합니다. 이 다양성 때문에 TypeScript 출력에 때때로 quicktype 런타임 헬퍼와 추가 보일러플레이트가 포함됩니다. 또한 서버에서 JSON을 처리하므로 기밀 페이로드 처리 시 주의가 필요합니다. json2ts.com은 더 간단하고 기본 인터페이스를 생성하지만 열거형 감지, readonly 지원, null 처리 옵션이 부족합니다.

MakeTypes는 런타임 파싱이 포함된 TypeScript 클래스를 생성합니다. 이 UtiloKit 변환기는 런타임 풋프린트가 없는 순수한 타입을 생성합니다 — 코드에 필요한 인터페이스나 타입 별칭만, 서버 업로드 없이, 계정 없이, 완전히 브라우저에서 실행됩니다.

설계부터 프라이버시 중시 — JSON은 브라우저를 절대 벗어나지 않음

모든 변환은 브라우저 탭에서 JavaScript를 사용하여 로컬로 수행됩니다. JSON은 서버에 업로드되거나 저장·공유되지 않습니다 — 오프라인에서도 작동하며 기밀 페이로드, 내부 API, 프로덕션 데이터 처리에 안전합니다. 이 JSON to TypeScript 변환기를 북마크해 두고 타입이 필요할 때마다 사용하세요.

관대한 파서는 // 주석, 후행 쉼표, 작은따옴표 문자열이 있는 JSON 유사 입력도 허용하므로 편집기에서 JavaScript 객체 리터럴을 그대로 붙여 넣어도 유효한 출력을 얻을 수 있습니다. 추가 단계는 필요하지 않습니다.

Frequently asked questions

JSON을 TypeScript로 어떻게 변환하나요?

입력 패널에 JSON을 붙여 넣으면(또는 샘플 버튼을 눌러 예제를 불러오면) 출력 패널에 TypeScript가 즉시 나타납니다. 예를 들어, {"id": 1, "name": "지민"} 은 export interface Root { id: number; name: string; }가 됩니다. 복사 또는 .ts 다운로드를 클릭해 타입을 프로젝트에 바로 추가하세요.

JSON에서 TypeScript 인터페이스를 생성하는 방법은?

출력을 Interface(기본값)로 설정하면 각 JSON 객체가 독립적인 export interface가 됩니다. 루트 이름 필드를 설정해 최상위 이름을 제어하세요. 예를 들어 { "id": 1, "name": "지민" }에서 루트 이름을 User로 하면 export interface User { id: number; name: string; }가 생성됩니다. 중첩 객체는 자동으로 각자 명명된 인터페이스가 됩니다.

인터페이스와 타입 별칭의 차이는 무엇인가요?

둘 다 동일한 객체 형태를 설명합니다 — Interface / Type / Class 토글로 코드베이스 선호도에 맞게 선택하세요. Interface 모드는 선언 병합으로 재개방·확장 가능한 export interface Root { … }를 출력하고, Type 모드는 유니온과 프리미티브도 표현 가능한 export type Root = { … }를 출력하며, Class 모드는 필드가 선언된 export class Root { … }를 출력합니다.

선택적 필드나 null 필드(? / | null)는 어떻게 처리하나요?

두 가지 토글로 제어합니다. '누락된 키에 선택적(?) 표시'는 객체 배열의 일부 항목에 없는 속성을 선택적으로 표시합니다. 'null → 선택적'은 zip: string | null 같은 nullable 필드를 zip?: string으로 다시 작성합니다. 명시적인 | null 유니온을 유지하려면 꺼두세요. 팀의 null 처리 스타일에 맞게 조합해서 사용하세요.

여기에 JSON을 붙여 넣어도 안전한가요?

네. 변환은 100% 클라이언트 사이드입니다. JSON은 브라우저 탭에서 실행되는 JavaScript로 파싱 및 변환되며, 서버에 업로드·기록·전송되지 않습니다. 인터넷을 끊어도 도구가 계속 작동하므로 프라이빗 API 응답 및 기밀 페이로드 처리에 안전합니다.

문자열 열거형 감지는 어떻게 작동하나요?

문자열 열거형 감지를 켜면 'shipped'와 'pending' 같은 반복 문자열 열이 단순 string 대신 리터럴 유니온 타입 "pending" | "shipped"로 추론됩니다. 이렇게 하면 생성된 타입이 훨씬 더 정밀하고 유용해집니다.

API나 Swagger 응답에서 타입을 생성할 수 있나요?

네 — API의 실제 JSON 응답을 붙여 넣으면 바로 사용 가능한 인터페이스가 추론됩니다. 이를 fetch나 axios 호출에 직접 연결하여 자동 완성과 타입 안전성을 활용할 수 있습니다. Swagger/OpenAPI 엔드포인트의 경우, 스키마 문서가 아닌 예제 응답 본문의 JSON을 복사해서 변환하세요.

Add, subtract, multiply matrices and compute determinant, inverse and transpose for 2×2–4×4 matrices.

데이터 및 형식