JSON 포매터 - JSON 데이터 정리, 검증, 변환 완벽 가이드
JSON의 기본 구조와 문법부터 Prettify/Minify 사용법, 문법 오류 디버깅, API 응답 분석, JSON과 다른 데이터 형식 비교까지 개발자를 위한 종합 가이드입니다.
JSON 포매터란?
JSON(JavaScript Object Notation)은 현대 웹 개발에서 가장 널리 사용되는 데이터 교환 형식입니다. REST API의 요청/응답 데이터, 설정 파일(package.json, tsconfig.json 등), NoSQL 데이터베이스(MongoDB), 웹 스토리지 등 거의 모든 곳에서 JSON이 사용됩니다.
API에서 받은 JSON 응답은 보통 한 줄로 압축되어 있어 사람이 읽기 매우 어렵습니다. JSON 포매터는 이런 압축된 JSON 데이터를 들여쓰기와 줄바꿈이 적용된 가독성 높은 형태로 정리(Prettify)하고, 문법 오류를 자동으로 검증하며, JSON 구조를 시각적으로 탐색할 수 있게 해주는 온라인 도구입니다.
반대로 정리된 JSON을 한 줄로 축소(Minify)하여 네트워크 전송 시 데이터 용량을 줄이는 것도 가능합니다. 별도의 IDE나 프로그램 없이 웹 브라우저에서 바로 사용할 수 있어, 빠른 디버깅과 데이터 분석에 매우 편리합니다.
JSON 기본 구조와 문법
JSON은 두 가지 기본 구조로 이루어져 있습니다.
객체 (Object)
중괄호 { }로 감싸진 키-값 쌍(key-value pair)의 집합입니다. 키는 반드시 큰따옴표로 감싼 문자열이어야 하며, 값은 문자열, 숫자, 불리언, null, 배열, 또는 다른 객체가 될 수 있습니다.
배열 (Array)
대괄호 [ ]로 감싸진 값의 순서 있는 목록입니다. 배열의 요소는 서로 다른 타입이어도 됩니다.
JSON이 지원하는 데이터 타입
| 타입 | 설명 | 예시 |
|---|---|---|
| 문자열 (String) | 큰따옴표로 감싼 텍스트 | "hello world" |
| 숫자 (Number) | 정수 또는 소수 (따옴표 없이) | 42, 3.14, -7 |
| 불리언 (Boolean) | 참/거짓 | true, false |
| null | 값 없음 | null |
| 객체 (Object) | 키-값 쌍의 집합 | {"name": "홍길동"} |
| 배열 (Array) | 값의 순서 있는 목록 | [1, 2, 3] |
주의: JSON에서는 주석(comment)이 허용되지 않습니다. // 또는 /* */를 사용하면 파싱 오류가 발생합니다. 또한 마지막 요소 뒤에 쉼표(trailing comma)를 붙이면 안 됩니다. JavaScript 객체에서는 허용되지만 JSON에서는 오류입니다.
JSON 포매터 주요 기능
- Prettify (정리) — 압축된 한 줄 JSON을 들여쓰기(2칸/4칸/탭)가 적용된 가독성 높은 형태로 정리합니다. 중첩된 객체와 배열의 구조를 한눈에 파악할 수 있습니다
- Minify (축소) — 정리된 JSON에서 모든 공백과 줄바꿈을 제거하여 한 줄로 축소합니다. API 요청 본문이나 데이터 저장 시 용량을 절약합니다
- Validate (검증) — JSON 문법 오류를 자동으로 감지하고, 오류 위치(줄 번호, 칼럼)와 설명을 표시합니다. "Expected ',' or '}'" 같은 구체적인 에러 메시지를 제공합니다
- 트리 뷰 (Tree View) — JSON 구조를 폴더처럼 펼치고 접을 수 있는 트리 형태로 시각화합니다. 깊게 중첩된 데이터에서 원하는 값을 빠르게 찾을 수 있습니다
- 경로 표시 (JSON Path) — 트리에서 특정 값을 클릭하면 해당 값의 경로(예: data.users[0].name)를 표시합니다. 프로그래밍에서 해당 값에 접근하는 코드를 바로 알 수 있습니다
- 검색 — JSON 내에서 특정 키나 값을 검색하여 하이라이트합니다. 대규모 JSON 데이터에서 원하는 정보를 빠르게 찾을 수 있습니다
- JSON ↔ 다른 형식 변환 — JSON을 CSV, XML, YAML 등 다른 데이터 형식으로 변환하거나, 반대로 다른 형식을 JSON으로 변환합니다
JSON 문법 오류와 해결 방법
JSON 파싱 오류는 개발 중 매우 자주 발생합니다. JSON 포매터에 붙여넣으면 오류 위치와 원인을 즉시 파악할 수 있습니다. 가장 흔한 오류를 정리했습니다.
| 오류 | 잘못된 예시 | 올바른 예시 |
|---|---|---|
| 키에 따옴표 누락 | {name: "홍길동"} | {"name": "홍길동"} |
| 작은따옴표 사용 | {'name': '홍길동'} | {"name": "홍길동"} |
| 마지막 쉼표 (trailing comma) | {"a": 1, "b": 2,} | {"a": 1, "b": 2} |
| 주석 사용 | {"a": 1 // comment} | {"a": 1} |
| undefined 사용 | {"a": undefined} | {"a": null} |
| 숫자에 따옴표 | {"age": "25"} (의도가 숫자인 경우) | {"age": 25} |
이런 오류들은 JavaScript 객체에서는 허용되지만 JSON에서는 엄격하게 금지됩니다. JSON은 JavaScript의 부분집합이지만 완전히 동일한 문법은 아니라는 점을 기억해야 합니다.
JSON vs XML vs YAML 비교
데이터 교환 형식은 JSON 외에도 XML, YAML 등이 있습니다. 각각의 특징과 장단점을 비교합니다.
| 항목 | JSON | XML | YAML |
|---|---|---|---|
| 가독성 | 좋음 | 보통 (태그가 많아 장황) | 매우 좋음 (최소 문법) |
| 파일 크기 | 작음 | 큼 (여닫는 태그 필요) | 가장 작음 |
| 주석 지원 | 불가 | 가능 | 가능 |
| 파싱 속도 | 빠름 | 느림 | 느림 |
| 주요 용도 | REST API, 웹 통신 | SOAP API, 기업 시스템 | 설정 파일 (Docker, K8s) |
2026년 현재 웹 API의 대부분은 JSON을 표준으로 사용하고 있으며, XML은 레거시 시스템이나 SOAP 기반 서비스에서 주로 사용됩니다. YAML은 Docker Compose, Kubernetes, GitHub Actions 등의 설정 파일에서 많이 쓰입니다.
실무 활용 사례
API 디버깅
REST API를 개발하거나 사용할 때, 서버에서 반환하는 JSON 응답을 분석해야 합니다. Postman이나 curl로 받은 응답을 JSON 포매터에 붙여넣으면 데이터 구조를 한눈에 파악하고, 원하는 필드의 경로를 빠르게 찾을 수 있습니다. 특히 중첩이 깊은 JSON(5단계 이상)은 정리 없이는 읽기가 거의 불가능합니다.
설정 파일 편집
package.json, tsconfig.json, .eslintrc.json 등 개발 환경 설정 파일을 수정할 때, 문법 오류가 하나라도 있으면 전체 빌드가 실패합니다. 수정 후 JSON 포매터에서 검증하면 오류를 미리 잡을 수 있습니다.
데이터 변환
엑셀 데이터를 JSON으로 변환하여 API에 전송하거나, JSON 데이터를 CSV로 변환하여 스프레드시트에서 분석하는 등의 데이터 형식 변환 작업에 활용됩니다.
인터넷 방송 도구 설정
OBS Studio의 일부 플러그인, 챗봇 설정, Streamlabs 알림 설정 등은 JSON 형식의 설정 파일을 사용합니다. 이런 설정을 수정할 때 JSON 포매터로 구조를 확인하고 검증하면 설정 오류를 방지할 수 있습니다.
자주 묻는 질문
Q. JSON과 JavaScript 객체의 차이는 무엇인가요?
JSON은 JavaScript 객체 표기법에서 파생되었지만 더 엄격한 규칙을 가집니다. (1) JSON 키는 반드시 큰따옴표로 감싸야 합니다(JS: 선택). (2) JSON 문자열은 큰따옴표만 허용합니다(JS: 작은따옴표도 가능). (3) JSON에는 주석이 불가합니다. (4) JSON에는 undefined가 없습니다(null만 가능). (5) JSON에 함수, Date, RegExp 등의 타입은 포함할 수 없습니다.
Q. JSON 파일의 최대 크기 제한은?
JSON 자체에는 크기 제한이 없지만, 처리하는 도구나 환경에 따라 제한이 있을 수 있습니다. 웹 브라우저의 JSON.parse()는 수백 MB의 JSON도 처리 가능하지만, 메모리 부족으로 느려질 수 있습니다. API 서버에서는 보통 요청 본문 크기를 1~10MB로 제한합니다(Express.js 기본값: 100KB).
Q. Prettify와 Minify 중 어떤 것을 사용해야 하나요?
용도에 따라 다릅니다. 사람이 읽고 편집할 때(디버깅, 설정 파일)는 Prettify, 네트워크로 전송하거나 저장할 때는 Minify를 사용합니다. API 응답의 경우 프로덕션에서는 Minify된 JSON을 전송하여 대역폭을 절약하고, 개발 환경에서는 Prettify된 JSON을 사용하여 디버깅을 편하게 합니다.
Q. JSON에 주석을 넣고 싶으면 어떻게 하나요?
공식 JSON 사양에서는 주석을 지원하지 않습니다. 하지만 대안이 있습니다: (1) JSONC(JSON with Comments) - VS Code의 settings.json 등에서 사용, (2) JSON5 - 주석, 후행 쉼표, 작은따옴표 등을 허용하는 확장 형식, (3) YAML로 전환 - 주석이 필요한 설정 파일은 YAML이 더 적합합니다. 표준 JSON을 사용해야 한다면 "_comment" 키를 사용하는 관행이 있지만 권장되지는 않습니다.
