📘 JSON Formatter로 API 응답 가독성 높이기

압축된 JSON을 보기 좋게 정리하는 법

API 응답을 개발자 도구에서 열어봤더니 줄바꿈 하나 없이 한 줄로 이어진 JSON을 마주한 경험, 다들 있을 겁니다. 이 글에서는 왜 API가 이런 형태로 데이터를 내려주는지, 포맷터가 정확히 무엇을 하는지, 그리고 JSON 문법에서 자주 틀리는 부분을 짚어봅니다.

왜 API는 압축된 JSON을 내려주나

사람이 보기엔 불편하지만, 서버 입장에서는 합리적인 선택입니다. 들여쓰기와 줄바꿈, 공백은 데이터 자체와는 무관한 "장식"이지만 전송량에는 그대로 더해집니다. 특히 응답이 크거나 요청 빈도가 높은 API일수록 불필요한 공백을 제거해 페이로드 크기를 줄이는 것이 대역폭과 응답 속도 측면에서 이득이 큽니다. 그래서 대부분의 API는 사람이 읽기 좋은 형태가 아니라 minify(압축)된 JSON을 기본으로 반환하며, 가독성은 필요할 때 클라이언트나 개발 도구 쪽에서 별도로 처리하도록 맡겨둡니다.

포맷터가 하는 일 — 데이터는 그대로, 모양만 정리

JSON 포맷터(prettifier)는 데이터의 내용을 전혀 바꾸지 않습니다. 키·값·배열·객체 구조는 그대로 둔 채, 중첩 단계에 맞춰 들여쓰기를 넣고 각 항목을 줄바꿈으로 구분해줄 뿐입니다. 예를 들어 {"user":{"id":1,"tags":["a","b"]}}라는 압축 JSON은 포맷터를 거치면 다음과 같이 바뀝니다.

{ "user": { "id": 1, "tags": ["a", "b"] } }

내부적으로는 JSON 문자열을 파싱해 데이터 구조(객체 트리)로 만든 뒤, 그 구조를 다시 들여쓰기 규칙에 맞춰 문자열로 출력하는 두 단계로 이루어집니다. 파싱 단계에서 문법이 잘못된 JSON은 오류로 걸러지기 때문에, 포맷터는 가독성 도구인 동시에 검증 도구 역할도 합니다.

자주 틀리는 JSON 문법

JavaScript 객체 리터럴과 비슷해 보이지만, JSON은 훨씬 엄격한 문법 표준(RFC 8259)을 따릅니다. 흔히 실수하는 부분은 다음과 같습니다.

마지막 항목 뒤 쉼표(trailing comma) 금지 — {"a":1,"b":2,}처럼 마지막에 쉼표가 남으면 파싱 오류가 납니다.
키는 반드시 큰따옴표로 감싸야 함 — {a:1}이나 {'a':1}은 유효하지 않고 {"a":1}만 허용됩니다.
주석 사용 불가 — // ...나 /* ... */ 같은 주석은 표준 JSON에 존재하지 않습니다.
단일 인용부호 불가 — 문자열 값도 반드시 큰따옴표를 써야 하며 작은따옴표는 오류입니다.
undefined·함수·NaN 사용 불가 — JSON은 순수 데이터 형식이므로 JavaScript의 특수 값들은 표현할 수 없습니다.

포맷팅이 디버깅에 도움이 되는 이유

한 줄로 붙어있는 JSON에서 문법 오류를 찾는 것은 매우 번거롭습니다. 어디서 괄호가 안 맞는지, 어느 배열이 안 닫혔는지 눈으로 세어야 하기 때문입니다. 반면 들여쓰기가 적용되면 중첩 구조가 시각적으로 드러나서, 괄호 짝이 안 맞는 지점이나 예상보다 한 단계 더 깊이 들어간 배열을 한눈에 찾아낼 수 있습니다. 복잡하게 중첩된 API 응답 구조를 처음 파악할 때도, 포맷팅된 형태로 보는 것이 전체 스키마를 이해하는 데 훨씬 효율적입니다.

압축된 JSON을 붙여넣기만 하면 즉시 들여쓰기가 적용된 형태로 바꿔주고, 문법 오류가 있다면 바로 짚어주는 도구가 있습니다.