API 응답을 콘솔에 찍었더니 한 줄로 된 JSON이 화면을 가득 메운다. 중괄호와 대괄호가 끝없이 이어지는 이 상태로는 어디가 어떤 값인지 알아보기 불가능하다. 들여쓰기와 줄바꿈만 잡아줘도 구조가 한눈에 들어온다.
왜 JSON이 한 줄로 붙어 있을까
서버에서 클라이언트로 데이터를 보낼 때는 통신 효율을 위해 공백과 줄바꿈을 제거한 압축(minified) 형태로 전송한다. 사람이 읽을 용도가 아니라 프로그램이 파싱할 용도이기 때문이다. 문제는 디버깅할 때 이 상태를 직접 읽어야 하는 상황이 생긴다는 것이다.
JSON을 정렬하면 뭐가 달라지나
같은 데이터라도 포맷팅 여부에 따라 가독성이 완전히 달라진다.
정렬 전 (압축 상태)
{"name":"홍길동","age":30,"address":{"city":"서울","zip":"06000"}}정렬 후
{
"name": "홍길동",
"age": 30,
"address": {
"city": "서울",
"zip": "06000"
}
}중첩 구조와 각 키-값 쌍이 명확하게 구분된다.
문법 오류를 잡는 것도 중요하다
JSON 파싱 에러의 원인은 대부분 사소한 실수다.
- 마지막 항목 뒤에 쉼표를 남겨둔 것 (trailing comma)
- 키를 작은따옴표로 감싼 것 (큰따옴표만 허용)
- 중괄호나 대괄호를 닫지 않은 것
- 문자열 안의 이스케이프 처리 누락
이런 오류는 에디터에서 찾기 어렵다. JSON 포매터에 붙여넣고 검증(Validate) 버튼을 누르면 오류 위치와 내용이 바로 표시된다. 정렬, 압축, 키 알파벳순 정렬까지 한 화면에서 처리되기 때문에 별도 도구를 여러 개 쓸 필요가 없다.
TIP 들여쓰기를 2칸, 4칸, 탭 중 선택할 수 있다. 팀 코딩 컨벤션에 맞춰 설정하면 복사해서 바로 코드에 붙여넣을 수 있다.
압축은 언제 쓸까
반대로 읽기 좋게 정리된 JSON을 다시 한 줄로 압축해야 할 때도 있다. 설정 파일에 넣거나, API 테스트 도구에 body로 붙여넣을 때가 그런 경우다. 포맷팅된 JSON에서 공백과 줄바꿈을 수동으로 지울 필요 없이 압축(Minify) 기능을 쓰면 된다.
JSON 구조가 복잡해질수록 포매터의 가치가 커진다. 중첩이 3단계만 넘어가도 눈으로 추적하기 힘든데, 정렬된 상태에서는 접히는 구조가 바로 보인다.