JSON
포맷터
JSON 정렬, 압축, 검증을 한번에
JSON 포맷터란?
JSON(JavaScript Object Notation)은 웹 개발의 사실상 표준 데이터 교환 형식입니다. REST API 응답, 설정 파일(package.json, .eslintrc), 데이터베이스 쿼리 결과, 로컬 스토리지 등 어디서나 사용됩니다. JSON 포맷터는 한 줄로 압축된 JSON을 들여쓰기(Format)하거나 반대로 압축(Minify)하고, 유효성 검사(Validate), 키 정렬(Sort Keys), 이스케이프/언이스케이프를 수행합니다. 모든 처리는 브라우저에서만 이루어져 API 키나 토큰이 포함된 민감한 JSON도 안전하게 다룰 수 있습니다.
활용 예시
- API 응답 JSON을 포맷팅해 구조 파악 및 디버깅
- package.json, tsconfig.json 등 설정 파일 정리
- 로그 파일의 압축된 JSON 이벤트 가독성 있게 변환
- API 요청 바디를 Minify해서 크기 측정 후 최적화
- 키 정렬로 두 JSON 응답의 구조 차이 비교(diff)
- JWT 페이로드 디코딩 후 JSON 포맷팅으로 내용 확인
자주 겪는 JSON 오류
JSON.parse()가 실패하는 원인은 대부분 세 가지입니다. 첫째, 배열·객체의 마지막 항목 뒤에 붙은 후행 쉼표(trailing comma) — JS 객체 리터럴은 허용하지만 JSON 표준(RFC 8259)은 파싱 오류로 처리합니다. 둘째, 키를 작은따옴표나 따옴표 없이 쓴 경우 — JSON은 키·문자열 값 모두 큰따옴표만 허용합니다. 셋째, 숫자가 2^53을 넘는 큰 정수를 그대로 쓴 경우 — JavaScript의 부동소수점 정밀도 한계로 마지막 자릿수가 반올림되어 원본과 다른 값이 될 수 있습니다(예: Twitter/Snowflake ID). 이 도구의 유효성 검사는 이런 문제를 실시간으로 잡아 오류가 발생한 정확한 줄·컬럼 위치를 알려줍니다.
자주 묻는 질문
JSON 포맷팅이란 무엇인가요?
압축된 JSON에 들여쓰기와 줄바꿈을 추가해 사람이 읽기 쉬운 형태로 변환하는 작업입니다. 디버깅, 코드 리뷰, API 응답 분석에 필수적입니다.
JSON 유효성 검사는 어떻게 작동하나요?
JSON 입력 시 실시간으로 문법을 검사합니다. 큰따옴표 누락, 후행 쉼표, 잘못된 중괄호 등을 감지해 오류 위치를 표시합니다.
후행 쉼표(trailing comma) 오류가 자주 발생합니다. 왜인가요?
JSON 표준(RFC 8259)은 배열이나 객체의 마지막 항목 뒤에 쉼표를 허용하지 않습니다. JavaScript에서는 가능하지만 순수 JSON에서는 파싱 오류가 발생합니다.
JSON 키를 알파벳순으로 정렬할 수 있나요?
네. 키 정렬 버튼을 클릭하면 모든 중첩 레벨의 키가 알파벳순으로 정렬됩니다. API 응답 비교나 diff 작업 시 일관성 유지에 유용합니다.
JSON 압축(Minify)은 언제 사용하나요?
공백과 줄바꿈을 제거해 데이터 크기를 줄입니다. API 응답 전송이나 설정 파일 배포 시 대역폭을 절감할 수 있습니다. 가독성이 불필요한 프로덕션 환경에 적합합니다.
인덴트를 2칸, 4칸, 탭으로 선택하는 기준은 무엇인가요?
팀의 코딩 스타일 가이드를 따르세요. JavaScript/TypeScript는 2칸, Python은 4칸이 일반적입니다. .editorconfig나 Prettier 설정과 일치시키세요.
JSON에서 주석을 사용할 수 있나요?
순수 JSON 표준은 주석을 지원하지 않습니다. 주석이 포함된 파일은 파서에서 오류가 납니다. 주석이 필요하다면 JSONC(JSON with Comments) 또는 JSON5 형식을 사용하세요.
JSON 이스케이프 처리는 언제 필요한가요?
JSON 문자열 내의 큰따옴표("), 백슬래시(\), 줄바꿈(\n) 등은 이스케이프가 필요합니다. JSON을 다른 JSON의 문자열 값으로 포함하거나 HTML 속성에 넣을 때 유용합니다.
JSON과 JavaScript 객체 리터럴의 차이는 무엇인가요?
JSON은 키를 반드시 큰따옴표로 감싸야 하며, 함수나 undefined를 값으로 사용할 수 없습니다. JavaScript 객체는 작은따옴표나 따옴표 없는 키를 허용하고 더 많은 타입을 지원합니다.
JSON 배열과 객체를 혼합할 수 있나요?
가능합니다. JSON은 객체 안에 배열을, 배열 안에 객체를 중첩하는 것을 완전히 지원합니다. REST API 응답과 설정 파일에서 매우 일반적인 구조입니다.
입력한 JSON 데이터가 서버로 전송되나요?
아닙니다. 모든 처리는 브라우저에서만 이루어집니다. API 키, 인증 토큰 등 민감한 JSON 데이터도 안전하게 포맷팅할 수 있습니다.
중첩된 JSON의 깊이 제한이 있나요?
JSON 표준 자체에는 깊이 제한이 없지만, 대부분의 파서는 성능 이유로 제한을 둡니다. 깊이가 10단계를 넘으면 구조 재설계를 권장합니다.