개발하다 보면 JSON 포매팅할 일이 진짜 자주 생기잖아요.
Postman에서 API 응답 받았는데 한 줄로 압축된 채로 와서 안 보일 때, 로그 파일에서 JSON 찾아서 구조 확인하고 싶을 때, 동료가 슬랙으로 던져준 설정 파일 검증할 때. 그럴 때마다 "JSON 포매터" 검색해서 아무 사이트나 들어가서 붙여넣었습니다.
근데 어느 순간 좀 찜찜해지더라고요. 내가 지금 회사 API 응답을 모르는 사이트에 붙여넣고 있는 거 아닌가? 거기에 고객 데이터, 인증 토큰, 내부 ID 같은 게 섞여 있는데?
그러다가 코딩나우에서 만든 JSON 포매터를 발견했는데, 이건 접근이 좀 달라서 후기 한 번 써봅니다.
핵심: 입력한 JSON이 서버로 안 갑니다
이게 가장 중요한 부분이에요.
대부분의 온라인 JSON 포매터는 내가 붙여넣은 JSON을 서버로 전송한 다음 처리해서 돌려주는 방식입니다. 그래서 회사 데이터 붙여넣는 게 사실 좀 위험해요. 그 서버에 로그가 남는지, 누가 보는지 알 수가 없으니까요.
근데 이건 전부 브라우저 안에서 JavaScript로 처리합니다. 페이지 로드 한 번 되면 그 다음부터는 네트워크 통신이 아예 없어요. 인터넷 끊고도 동작합니다.
회사 API 응답 검증할 때, 인증 토큰 섞인 로그 분석할 때, 고객 정보 들어간 JSON 다룰 때 마음 편하게 쓸 수 있는 게 진짜 큰 차이입니다.
{} JSON 포매터 바로 쓰기
👉 https://www.coding-now.com/json-formatter
외형은 다크 앰버 CRT 테마
이 사이트 만든 분이 만든 다른 도구들(시리얼 터미널 CNTerminal 같은 거)에서 본 색감인데, 여기도 같은 톤이에요. 까만 배경에 주황색 글씨. 오래된 도스 컴퓨터 같은 느낌.
처음 봤을 땐 "이거 컨셉인가?" 싶었는데, 진짜로 한 시간쯤 JSON 들여다보고 있으면 일반 흰 배경보다 눈이 훨씬 덜 피곤합니다. 야간 작업할 때 특히.
그리고 JSON 타입별로 색상이 다 다릅니다. 키는 한 색, 문자열은 다른 색, 숫자/불리언/null은 또 다른 색. 한눈에 구조가 들어와요.
기본 기능들이 다 깔끔합니다
Format - 들여쓰기 옵션 3가지
2칸, 4칸, 탭 중에 선택할 수 있어요. 저는 2칸 좋아하는데, 회사 컨벤션에 따라 다르게 쓰시는 분들도 많죠. 탭 들여쓰기 좋아하시는 분들도 있고. 그 셋 중에 골라서 쓸 수 있습니다.
Minify - 압축률까지 보여줌
JSON을 한 줄로 압축할 때 단순히 공백만 제거하는 게 아니라, 얼마나 줄어들었는지 절약률 %를 보여줍니다. 원본 대비 몇 % 줄었는지 바로 확인되니까 API 응답 최적화할 때 유용해요. "이거 Minify하면 30% 줄어드네" 같은 거 바로 보입니다.
Validate - 오류 위치를 정확히 알려줌
이게 진짜 유용한 기능이에요. 잘못된 JSON 붙여넣으면 그냥 "오류"라고만 알려주는 사이트가 많은데, 여긴 줄(Line)·칸(Col) 위치와 메시지를 같이 표시해줍니다. 게다가 해당 줄을 강조해주니까 어디가 문제인지 한 번에 보여요.
1000줄짜리 JSON에서 콤마 하나 빠뜨렸을 때 이거 없으면 진짜 찾기 힘듭니다. 줄/칸 위치 알려주는 것만으로도 디버깅 시간이 확 줄어요.
Tree View - 접고 펼치고
JSON을 트리 구조로 보여주는데, 각 객체/배열을 접거나 펼 수 있습니다. 중첩이 깊은 JSON에서 "내가 지금 어디 있는지" 파악할 때 좋아요. 키나 항목 개수도 같이 표시되니까 "이 배열 몇 개짜리지?" 바로 보입니다.
통계가 의외로 유용합니다
포매팅 결과 옆에 통계 정보가 같이 떠요.
- UTF-8 바이트 (원본·결과) - 실제 전송될 크기
- Minify 절약률 % - 압축 효과
- 키 개수 - 전체 키가 몇 개인지
- 최대 중첩 깊이 - 구조가 얼마나 복잡한지
이게 왜 좋냐면, API 응답 설계할 때 "이 응답 너무 크지 않나?" 가늠할 때 편합니다. 모바일 환경에서 데이터 크기 신경 써야 할 때 특히.
그리고 "최대 중첩 깊이"는 솔직히 큰 도움이에요. JSON이 5단계, 7단계로 깊어지면 코드에서 다루기 어려워지는데, 그걸 숫자로 바로 보여주니까 "아 이건 구조 좀 단순화해야겠네" 판단이 됩니다.
드래그앤드롭도 됩니다
JSON 파일을 화면에 끌어다 놓으면 자동으로 로드되고 포매팅까지 한 번에 됩니다. 매번 파일 열어서 복사하고 붙여넣을 필요 없어요.
그리고 결과는 클립보드 복사나 .json 파일 다운로드로 빼낼 수 있습니다. 동료한테 슬랙으로 보낼 땐 복사, 파일로 정리하고 싶을 땐 다운로드.
단축키도 있어요
키보드 좋아하시는 분들 반가워하실 거예요. Ctrl+Enter (맥은 Cmd+Enter) 누르면 바로 포매팅 실행됩니다. 마우스로 버튼 누르러 안 가도 돼요.
샘플 JSON 로드 버튼도 있어서, 도구 처음 써볼 때 "뭐 넣어보지?" 고민할 필요 없이 샘플 한 번 눌러보면 어떻게 동작하는지 바로 감 잡힙니다.
설치 가입 광고 다 없습니다
그냥 페이지 들어가면 끝이에요.
회원가입 없고, 광고 없고, 결제 없고, 설치 없고, 추적도 없습니다. 한 번 페이지 열어두면 인터넷 끊겨도 동작해요. 단일 HTML 파일이고 외부 라이브러리도 안 쓴다고 합니다.
저장하고 싶으면 페이지를 그냥 저장(Ctrl+S)해서 로컬에 두고 쓸 수도 있어요. USB에 넣어 다녀도 되고. 진짜 가벼운 도구입니다.
한국어/영어 둘 다 됩니다
우측 상단에 KR/EN 토글이 있어서 클릭 한 번이면 언어 전환됩니다. 라벨, 버튼, 에러 메시지까지 다 번역돼 있어요.
그리고 선택한 언어는 브라우저에 저장돼서 다음 방문 때도 그대로 유지됩니다. 한 번만 KR로 바꿔두면 계속 한국어로 쓸 수 있어요.
이런 분들한테 좋습니다
저는 백엔드 API 만지는 일이 많아서 진짜 자주 씁니다. API 응답 검증할 때 회사 데이터 안 외부로 안 나가니까 마음 편하고.
프론트엔드 개발자분들도 좋아하실 거예요. fetch 응답 콘솔에서 복사해서 붙여넣고 구조 파악할 때 빠릅니다.
데이터/QA 분들도. 대량 JSON 검증, 구조 분석할 때 통계 정보가 유용합니다.
그리고 JSON 처음 공부하시는 분들한테도 좋아요. 트리 뷰로 구조 보여주고, 에러 위치 알려주니까 어디가 잘못됐는지 학습하기 좋습니다.
단점 솔직히 말하면
이 도구도 완벽한 건 아니에요. 솔직하게 단점도 말씀드리면.
1) 5MB 입력 제한이 있습니다. 매우 큰 JSON 파일(로그 덤프 같은 거)은 못 다룹니다. 5MB 넘어가는 거 다루실 분들은 jq 같은 CLI 도구를 쓰시는 게 맞아요. 근데 일반적인 API 응답이나 설정 파일 크기에선 5MB는 충분합니다.
2) JSON Path 추출이나 검색 기능은 없습니다. "$.users[0].name" 같은 쿼리로 특정 값 뽑아내는 기능은 아직 없어요. 로드맵에는 있다고 하니까 나중엔 추가될 수도 있겠죠.
3) JSON ↔ YAML, CSV 변환도 없습니다. 순수 JSON 포매팅에 집중한 도구라 변환 기능은 빠져있어요. 이것도 로드맵에 있다고 하긴 하는데, 지금은 없습니다.
4) 두 JSON 비교(diff)도 안 됩니다. 두 JSON의 차이점 보고 싶을 땐 별도 diff 도구를 써야 해요. 이것도 로드맵에 있긴 합니다.
요약하면 "기본 포매팅·검증·트리 탐색에 집중하고, 나머지는 다음 버전에서" 이런 컨셉이에요. 그리고 기본 기능들은 정말 잘 만들어져 있습니다.
받는 곳 (이라기보단 쓰는 곳)
이것도 웹 도구라서 다운로드 안 받고 그냥 접속하면 바로 쓸 수 있어요.
코딩나우라는 사이트에 있습니다. 만든 분이 다른 도구들도 같이 공개해놓으셨더라고요. 스타크래프트 미니맵 레이더, GUI 앱 컨트롤러, 한국어 TTS 프로그램 Voxsave, 시리얼 터미널 CNTerminal, 오디오 커터 같은 것들도 있어요. 개발자 도구뿐 아니라 일반 사용자 도구도 다양합니다.
{} JSON 포매터 바로 쓰기
👉 https://www.coding-now.com/json-formatter
오픈소스(MIT)라서 GitHub에 코드 다 공개돼 있어요. 직접 호스팅하셔도 되고요.
마무리
JSON 포매터 같은 거 어디서나 쓸 수 있다고 생각하기 쉬운데, 사실 회사 데이터 다룰 땐 "이 사이트 믿을 수 있나?" 생각해보면 좀 찜찜한 게 사실이에요.
그동안 별생각 없이 아무 사이트나 쓰셨던 분들, 이거 한 번 즐겨찾기에 넣어두시면 마음 편합니다. 회사 데이터든 개인 데이터든 안 외부로 나가니까요.
특별히 화려한 기능은 없어요. 근데 "JSON 포매팅·검증·트리 탐색"이라는 기본기를, 가입도 광고도 추적도 없이, 줄/칸 단위로 정확한 에러 표시까지 해주면서 무료로 쓸 수 있다는 게 이 도구의 매력입니다.
저는 이제 Postman 응답 보다가 JSON 포매팅 필요하면 그냥 이걸 띄웁니다. 한 번 써보시고 어떠셨는지 댓글로 알려주시면 재밌을 것 같아요.
{} JSON 포매터 사용하러 가기
👉 https://www.coding-now.com/json-formatter