JSON 포매팅이란 무엇인가요?
JSON(JavaScript Object Notation)은 RFC 8259와 ECMA-404에 의해 정의된 가볍고 텍스트 기반의 데이터 교환 형식입니다. JSON 문서는 여섯 가지 값 타입의 트리입니다 — object, array, string, number, boolean, null. 포맷팅은 사람이 그 트리를 읽을 수 있도록 공백을 추가하고, 최소화는 기계가 더 빠르게 전송할 수 있도록 공백을 제거합니다.
JSON 포매팅은 어떻게 작동하나요?
입력은 브라우저에 내장된 JSON.parse와 JSON.stringify 함수를 사용해 전적으로 브라우저 내에서 처리됩니다. 주요 단계는 다음과 같습니다:
- 텍스트 영역에서 입력을 읽고, 앞뒤 공백을 제거합니다.
- 브라우저는
JSON.parse로 입력을 분석합니다. 입력이 유효한 JSON이 아니라면 파서는SyntaxError를 던지고, 이는 잡혀서 멈춘 행과 열 정보와 함께 표시됩니다. - 입력이 유효하면 파싱된 값이
JSON.stringify(value, null, indent)로 다시 출력됩니다.indent는 선택한 들여쓰기(2칸, 4칸 또는 탭 문자)입니다. - 최소화 시에는
JSON.stringify(value)를 들여쓰기 인자 없이 호출하여, 같은 값의 가장 짧고 유효한 형태를 생성하며 불필요한 공백은 모두 사라집니다. - 결과는 읽기 전용 텍스트 영역에 기록되고, 상태 패널은 유효한 JSON이거나 정확한 파싱 오류를 표시해 원본을 바로 고칠 수 있게 합니다.
이 도구로 JSON을 포매팅하는 이유는 무엇인가요?
- 프라이버시: 모든 파싱, 포맷, 최소화 작업이 브라우저에서 일어납니다. JSON은 절대 서버로 전송되지 않습니다.
- 즉각적인 검증: 잘못 찍힌 쉼표, 따옴표 없는 키, 작은따옴표, 후행 쉼표 등을 정확한 행과 열 정보와 함께 알려주므로 곧바로 버그를 잡을 수 있습니다.
- 리뷰에 적합한 출력: 일관된 들여쓰기로 정돈된 JSON은 깔끔한 코드 리뷰 diff와 읽기 좋은 설정 파일을 만들어 줍니다.
- 프로덕션용 최소화: 불필요한 공백을 제거하면 API 페이로드, 매니페스트 파일, 임베디드 픽스처를 배포 전에 작게 만들 수 있습니다.
JSON 포매팅의 일반적인 활용 사례는 무엇인가요?
JSON 읽고 쓰기는 웹 개발과 도구 작업 전반에서 자주 등장합니다:
- API 디버깅:
curl이나 네트워크 패널에서 받은 원시 응답을 붙여넣어 구조를 확인하고, 키의 오타를 찾고, 빠진 닫힘 중괄호를 발견하기. - 설정 정리: 손으로 편집한
package.json,tsconfig.json, CI 매니페스트를 다시 들여 써서 리뷰와 린터를 통과하게 만들기. - 로그 읽기: 압축된
application/json로그 줄을 다시 포맷해 각 필드가 위아래로 정렬되게 한 뒤, 티켓에 붙여넣기 전에 다시 최소화하기.
JSON 포매팅 예시는 어떻게 생겼나요?
{"id":42,"name":"Ada Lovelace","email":"ada@example.com","roles":["admin","engineer"]}을 붙여넣고 2칸 들여쓰기로 포맷을 누르면, 객체의 각 필드와 배열의 각 항목이 한 줄씩 차지하면서 아홉 줄로 펼쳐집니다. 포맷된 텍스트에 최소화를 누르면 같은 콤팩트 문자열로 바이트 단위까지 똑같이 다시 줄어듭니다.
이 JSON 포매터는 여러분의 Node.js, Deno 또는 브라우저 런타임이 사용하는 것과 같은 엔진으로 파싱하며, 그 결과를 코드, 설정, 로그 어디든 그대로 붙여넣을 수 있습니다.