마케팅 팀에서 일하는데, 어느 날 개발팀에서 API 응답 데이터를 확인해달라는 요청이 왔습니다. 파일을 열었더니 이런 내용이었습니다.

{"user":{"id":12345,"name":"홍길동","email":"hong@example.com"},"orders":[{"id":1001,"product":"노트북","price":1200000,"status":"배송중"},{"id":1002,"product":"마우스","price":35000,"status":"완료"}]}

이게 뭔지 알 수가 없었습니다. 개발자에게 물어봤더니 "JSON인데, 포맷터에 넣어보세요"라고 했습니다. 포맷터에 넣었더니 갑자기 읽을 수 있는 형태가 됐습니다. 그날 처음으로 JSON을 이해했습니다.

JSON이 뭔가

JSON(JavaScript Object Notation)은 데이터를 저장하고 전달하는 형식입니다. 프로그래밍 언어와 시스템 사이에 데이터를 주고받을 때 가장 많이 쓰는 표준 형식입니다.

구조가 단순합니다. 중괄호 "{}" 안에 키:값 쌍이 들어가고, 대괄호 "[]" 안에 목록(배열)이 들어갑니다.

포맷터로 위 예시를 정리하면 이렇게 됩니다.

{

"user": { "id": 12345, "name": "홍길동", "email": "hong@example.com" },

"orders": [

{ "id": 1001, "product": "노트북", "price": 1200000, "status": "배송중" },

{ "id": 1002, "product": "마우스", "price": 35000, "status": "완료" }

]

}

이렇게 보니 읽을 수 있습니다. user라는 사람의 정보가 있고, orders 목록에 두 개의 주문이 있습니다. 각 주문에는 id, 상품, 가격, 상태가 있습니다.

JSON 포맷터가 필요한 이유

API 응답이나 로그 파일, 설정 파일의 JSON은 보통 공백과 들여쓰기 없이 한 줄로 압축되어 있습니다. 파일 크기를 줄이고 전송 속도를 높이기 위해서입니다.

컴퓨터는 이 형태로도 완벽하게 읽을 수 있지만, 사람이 읽기에는 불가능에 가깝습니다. JSON 포맷터(또는 JSON Beautifier)는 이 압축된 JSON을 사람이 읽기 좋게 들여쓰기, 줄바꿈, 색상 구분을 추가해서 보여줍니다.

반대로, 사람이 읽기 좋게 작성한 JSON을 다시 한 줄로 압축(Minify)하는 기능도 있습니다.

비개발자가 JSON을 만나는 상황들

생각보다 다양한 상황에서 JSON을 접하게 됩니다.

API 오류 디버깅: 서비스가 제대로 동작하지 않을 때 개발팀에서 API 응답을 공유하며 확인을 요청하는 경우가 있습니다. 포맷터로 보면 어떤 값이 들어왔는지 파악할 수 있습니다.

구글 애널리틱스/광고 데이터 내보내기: 일부 플랫폼에서 데이터를 JSON 형태로 내보냅니다.

콘텐츠 관리 시스템(CMS): 워드프레스 같은 CMS에서 테마나 플러그인 설정을 JSON으로 내보내고 가져오는 기능이 있습니다.

마케팅 API 연동 확인: 페이스북 광고 API, 카카오 모먼트 API 등에서 응답 데이터를 JSON으로 받습니다.

A/B 테스트 설정: 일부 A/B 테스트 도구에서 실험 설정을 JSON으로 관리합니다.

JSON 읽는 기본 규칙

규칙 몇 가지만 알면 기본적인 JSON을 읽을 수 있습니다.

중괄호 {}: 객체(Object). 하나의 '항목'을 나타냅니다. 안에 키:값 쌍들이 들어갑니다.

대괄호 []: 배열(Array). 여러 항목의 목록입니다. 같은 종류의 데이터가 여러 개 있을 때 씁니다.

따옴표 "" 안의 텍스트: 키 이름이거나 문자열 값입니다.

따옴표 없는 숫자: 숫자 값입니다.

true / false: 참/거짓을 나타냅니다.

null: 값이 없음을 나타냅니다.

JSON 포맷터 도구 활용 팁

유효성 검사: 좋은 JSON 포맷터는 JSON이 올바른 형식인지 검사해줍니다. 괄호가 하나 빠지거나, 콤마가 잘못됐거나, 따옴표가 안 닫혔으면 오류를 표시합니다.

키 검색: 큰 JSON에서 특정 키 값을 찾을 때 검색 기능을 씁니다.

트리 뷰: 중첩된 구조를 접고 펼칠 수 있는 트리 뷰 기능이 있으면 복잡한 JSON도 탐색하기 쉽습니다.

민감 정보 주의: JSON 파일에 비밀번호, API 키, 개인정보가 포함된 경우, 온라인 포맷터에 붙여넣기 전에 민감 정보를 제거하거나 로컬 도구를 사용하세요.

마치며

JSON을 이해한 후 개발팀과의 커뮤니케이션이 훨씬 편해졌습니다. "이 값이 null로 오는데 이게 문제 아닌가요?"라고 직접 물어볼 수 있게 됐습니다. 이전에는 "뭔가 이상한 것 같은데요"라고만 할 수 있었습니다.

비개발자에게 JSON을 읽는 능력은 선택이 아닌 실용적인 스킬이 됐습니다. 특히 데이터를 다루거나 기술팀과 협업이 많은 직군이라면 기본적인 JSON 읽기는 알아두는 게 도움이 됩니다.