QUESTION #0262
프론트엔드

JSON Schema에 대해 설명해주세요.

JSON Schema에 대해 설명해주세요.

분야: 프론트엔드


JSON Schema는 JSON 데이터의 형식을 기술하고 검증하기 위한 명세서입니다. 특정 JSON이 어떤 구조를 가져야 하는지를 명시할 수 있도록 해줍니다.

예를 들어 회원 정보에 대한 명세를 다음과 같이 작성할 수 있습니다.

{
  "type": "object",
  "properties": {
    "username": { "type": "string", "minLength": 3 },
    "email": { "type": "string", "format": "email" },
    "password": { "type": "string", "minLength": 6 }
  },
  "required": ["username", "email", "password"],
  "additionalProperties": false
}

JSON Schema가 어떻게 활용될 수 있는지 구체적으로 설명해 드리겠습니다.

먼저, 백엔드 API와의 통신 과정에서 데이터 형식을 검증하는 데 활용될 수 있습니다. 예를 들어 백엔드에서 데이터를 내려줄 때, JSON Schema를 활용하여 그 데이터가 어떤 속성들을 가지고 있는지, 타입은 어떤지, 필수인지 아닌지 정의할 수 있습니다. 그러면 프론트엔드에서는 그 스키마를 기준으로 데이터의 유효성을 검증할 수 있어서, API 통신에서 발생할 수 있는 오류를 사전에 방지할 수 있습니다.

JSON Schema는 정적 타입 생성 도구와 통합되어 사용되며 개발 생산성을 높여주기도 합니다. 예를 들어 json-schema-to-typescript 같은 도구를 사용하면 JSON Schema로부터 TypeScript 타입을 자동 생성할 수 있습니다. 이는 API 명세에 따라 타입을 작성하거나 수정하는 시간을 아껴주며, 스키마와 타입 간의 불일치를 줄이는 데 도움이 됩니다.

또한, 설정 파일에 대한 명세서로 활용될 수 있습니다. 예를 들어 eslintrc, tsconfig, prettierrc 같은 설정 파일들은 대부분 JSON 기반 형식을 사용하는데, JSON Schema Store에서 이러한 설정 파일들의 JSON Schema를 찾아볼 수 있습니다. VSCode와 같은 에디터에서 이 스키마를 기반으로 자동 완성, 타입 힌트, 경고 메시지 등을 지원하기 때문에, 설정 실수를 줄이고 생산성을 높이는 데 큰 도움이 됩니다.

📚 추가 학습 자료를 공유합니다.