JSON → TypeScript Interface 생성기
JSON 붙여넣어 TypeScript interface 자동 생성. 중첩 분리, 배열 union 추론, null / readonly 옵션.
완전 무료
가입 불필요
브라우저 완결
즉시 다운로드
5 개 언어
다크 모드
📖 자주 걸리는 지점
JSON 샘플에서 TypeScript 의 interface 를 조립합니다. 처리는 브라우저 안에서 끝납니다. 여기서 유념할 점은 생성할 수 있는 것은 붙여 넣은 샘플에 나타난 형태뿐이라는 것입니다. 생략 가능한 필드, null 이 될 수 있는 값, 여러 타입을 갖는 유니온은 그 샘플에 실례가 없으면 존재하지 않는 것으로 취급됩니다.
| 사례 | 무슨 일이 일어나는가 | 어떻게 하면 되는가 |
|---|---|---|
값이 null 인 필드가 있다 |
샘플에 "deletedAt": null 밖에 없으면 그 필드가 원래 무슨 타입인지 정할 방법이 없습니다. null 타입이나 any 가 되고, 실제로 날짜 문자열이 들어오는 순간 타입이 거짓이 됩니다. |
실데이터를 여러 건 병합한 샘플을 붙여 넣는 것이 가장 확실합니다. 어렵다면 생성 후에 deletedAt: string | null 처럼 손으로 고칩니다. strictNullChecks 를 켜 두면 고치지 못한 곳은 컴파일러가 알려 줍니다. |
| 배열이 비었거나 요소가 하나뿐 | [] 에서는 요소의 타입을 추론할 수 없어 never[] 나 any[] 가 됩니다. 요소가 하나뿐인 경우도 위험해서 그 한 건에 우연히 없던 필드가 타입에서 그대로 사라집니다. |
배열에는 성질이 다른 요소를 2~3건 넣으세요. 선택 항목이 있는 것과 없는 것, 값이 최대 길이인 것 같은 식입니다. 생성된 타입 중 실제로 생략 가능한 것에는 ? 를 붙이는 것을 잊지 마세요. |
| 생성한 타입을 정본으로 다룸 | 샘플은 구현의 한 예일 뿐 사양 그 자체가 아닙니다. API 쪽이 나중에 필드를 추가해도 타입은 바뀌지 않고, 반대로 이 샘플에 우연히 없었을 뿐인 항목을 빠뜨린 채 운영에 나가게 됩니다. | OpenAPI 나 JSON Schema 가 있다면 그쪽을 유일한 정본으로 삼고 타입은 거기서 생성하세요. 스키마를 다듬어야 할 때는 JSON Schema 검증기와 OpenAPI → curl 변환이 도움이 됩니다. 스키마가 아예 없는 외부 API 라면 받은 직후 경계에서 검증하는 구성(zod / valibot 등)으로 두면 타입과 실데이터의 어긋남이 운영에서 처음 드러나는 사고를 막을 수 있습니다. |
JSON 의 숫자는 모두 number 가 되지만 자바스크립트의 number 는 253-1(9,007,199,254,740,991) 을 넘는 정수를 정확히 보관하지 못합니다. int64 ID 를 돌려주는 API 에서는 자릿수가 떨어져 다른 레코드를 가리키게 됩니다. 서버 쪽에서 ID 를 문자열로 돌려주도록 맞추거나 bigint 로 받으세요. 날짜도 마찬가지여서 "2026-07-26T00:00:00Z" 는 string 밖에 되지 않으므로, Date 로 변환하는 계층을 어디에 둘지 먼저 정해 두면 나중에 타입을 고쳐 쓰는 수고가 없습니다.
📖 사용법
-
1
JSON 붙여넣기단일 객체 / 배열 모두 OK
-
2
옵션 조정interface / type / null / readonly
-
3
복사 또는 .ts 다운로드코드베이스에 바로 붙여넣기
❓ 자주 묻는 질문
배열에 혼합 타입?
모든 요소 분석 -> union 타입
null vs undefined？
JSON에 undefined 없음. ON: field?: T, OFF: field: T | null
날짜 / 커스텀 타입？
JSON에서 string -> 수동 변환
🐛 이 도구에서 문제가 발생했나요?
무료 · 가입 불필요. 재현 절차만이라도 도움이 됩니다. 보고는 운영자에게 직접 전달되어 개선에 사용됩니다.
✅
보고 감사합니다!
운영자에게 전달되었습니다. 개선에 사용됩니다.