JSON에서 TypeScript 인터페이스 생성기 | fixjson.org

input.json

{
  "id": 1,
  "name": "Alice Johnson",
  "email": "alice@example.com",
  "age": 30,
  "active": true,
  "address": {
    "street": "123 Main St",
    "city": "New York",
    "zip": "10001"
  },
  "tags": ["admin", "editor"],
  "orders": [
    { "id": 101, "total": 49.99, "status": "shipped" },
    { "id": 102, "total": 99.00, "status": "pending" }
  ]
}

types.ts

변환을 클릭하면 TypeScript 인터페이스를 생성합니다.

관련

TS Types 가이드

전체 가이드 →

LLM의 JSON 출력 복구: AI의 '거의 JSON' 다루기

LLM은 흔히 ```json 펜스로 감싸인 JSON을, 작은따옴표, Python 리터럴, 따옴표 없는 키와 함께 반환합니다. 구문을 복구하고, 엄격하게 검증한 다음, 정리된 출력에서 TypeScript 타입을 도출하세요.

LLM이 만든 JSON 고치기

AI 응답은 JSON처럼 보여도 마크다운 펜스, 주석, Python 스타일 리터럴, JavaScript 객체 문법이 섞여 있을 때가 많습니다.

JSON vs JavaScript 객체 리터럴

JSON은 JavaScript 객체 리터럴과 비슷해 보이지만, 더 작고 더 엄격한 데이터 포맷이며 실행 가능한 값을 포함하지 않습니다.

JSON 을 TypeScript 로 변환하는 방식

각 JSON 객체는 TypeScript 의 interface 를 생성합니다. 루트 객체의 기본 이름은 Root 입니다. 중첩된 객체는 해당 속성 이름에서 명명된 개별 인터페이스가 됩니다 —— address 라는 키는 Address 인터페이스가 됩니다.

배열과 선택적 필드

객체 배열은 모든 요소에서 등장한 키를 합쳐 줍니다. 일부 요소에서 키가 빠져 있으면 선택적 속성(key?: Type)이 됩니다. 원시 타입 배열은 string[] 이나 number[] 같은 타입 시그니처가 됩니다.

언제 사용할까

API 통합 —— 응답을 붙여 넣으면 TypeScript 프로젝트에 그대로 넣을 수 있는 타입 정의가 바로 생깁니다
프로토타이핑 —— 파싱 로직을 본격적으로 작성하기 전에 새 API 나 데이터셋의 인터페이스 골격을 빠르게 세웁니다
코드 리뷰 —— JSON 페이로드의 형태가 코드가 기대하는 인터페이스와 일치하는지 확인합니다