JSON 포맷터
지저분한 JSON을 한 번에 정돈하고, 문법 오류 위치까지 짚어 줍니다.
{
"name": "홍길동",
"active": true,
"tags": ["api", "json"]
}설명
JSON을 들여쓰기해 읽기 좋게 정렬하거나 한 줄로 압축하고, 문법 오류가 있으면 그 위치를 알려 줍니다. 모든 처리는 브라우저 안에서만 이뤄져 데이터가 서버로 전송되지 않습니다.
관련 도구
JSON 포맷터는 한 줄로 압축된 JSON 문자열을 들여쓰기와 줄바꿈이 적용된 읽기 쉬운 형태로 정렬해 주고, JSON 문법 오류도 즉시 잡아 줍니다. API 응답이나 로그에서 뭉쳐 있는 JSON 데이터를 육안으로 확인해야 하거나, 직접 작성한 JSON 파일에 오류가 있는지 검증할 때 빠르게 활용할 수 있습니다. 브라우저 안에서만 처리되므로 API 키나 민감한 데이터가 담긴 JSON도 안심하고 붙여 넣을 수 있습니다.
사용 방법
입력 창에 정렬하거나 검증하고 싶은 JSON 텍스트를 붙여 넣습니다. '보기 좋게 정렬' 버튼을 누르면 2칸 들여쓰기가 적용된 형태로 즉시 변환됩니다. JSON 문법에 오류가 있으면 어느 위치에서 오류가 발생했는지 표시해 줍니다. 반대로 '한 줄로 압축' 기능을 쓰면 불필요한 공백을 제거해 전송·저장에 최적화된 최소 크기 JSON으로 만들 수 있습니다. 결과 카드의 '결과 복사' 버튼으로 결과물을 클립보드에 바로 가져갈 수 있습니다.
자주 하는 실수와 오류 원인
JSON에서 가장 흔한 오류는 마지막 항목 뒤에 쉼표를 붙이는 것입니다(trailing comma). 예를 들어 {"a":1, "b":2,} 처럼 마지막 값 뒤에 쉼표가 있으면 JSON 표준에 위반됩니다(JavaScript 객체 리터럴과 달리 JSON은 trailing comma를 허용하지 않습니다). 두 번째로 흔한 실수는 키 이름을 작은따옴표로 감싸는 것인데, JSON 표준은 반드시 큰따옴표를 써야 합니다. 문자열 안에 줄바꿈 문자(\n 아닌 실제 개행)가 들어가도 파싱 오류가 납니다. 이 포맷터는 이런 오류 위치를 정확히 짚어 주므로 수동으로 전체를 훑을 필요가 없습니다.
개발 워크플로우에서 활용하기
REST API 테스트 중 curl이나 Postman으로 받은 응답 JSON이 길고 복잡할 때, 이 도구에 붙여 넣으면 중첩 구조를 한눈에 파악할 수 있습니다. 설정 파일(package.json, tsconfig.json, appsettings.json 등)을 수동으로 수정한 뒤 저장 전 검증 단계로 활용하면 배포 후 파싱 오류를 미리 막을 수 있습니다. JSON 스키마를 동료와 공유할 때 압축 버전을 사람이 읽기 좋은 형태로 풀어 리뷰하는 용도로도 자주 씁니다.
자주 묻는 질문
JSON5나 JSONC(주석 있는 JSON)도 처리할 수 있나요?
들여쓰기는 몇 칸으로 정렬되나요?
매우 큰 JSON 파일(수 MB)도 처리할 수 있나요?
포맷 결과를 파일로 저장할 수 있나요?
API 응답에서 복사한 JSON에 BOM이나 특수 공백이 있어도 되나요?
개인정보처리방침
모든 처리는 브라우저 내부에서만 수행되며 입력값·파일은 서버로 전송·저장되지 않습니다. 광고: Google AdSense(쿠키 사용 가능, 설정). 문의 kjh920424@gmail.com
JSON 포맷터 사용법
왼쪽(또는 위쪽) 입력창에 정렬되지 않은 JSON 문자열을 붙여넣고 실행하면, 중괄호 {}와 대괄호 []의 중첩 깊이에 따라 들여쓰기가 적용된 결과가 출력됩니다. API 응답을 그대로 복사해 오거나, 로그에 한 줄로 찍힌 JSON, 설정 파일 일부를 넣으면 사람이 읽기 좋은 계층 구조로 바뀝니다. 반대로 정렬된 JSON을 한 줄로 압축(minify)해 용량을 줄이는 것도 같은 데이터를 다루는 이 도구의 기본 기능입니다.
작동 원리 — 파싱과 재출력
이 도구는 단순히 공백만 넣는 것이 아니라, 입력을 실제로 파싱해 메모리상의 객체로 만든 뒤 다시 문자열로 직렬화합니다. 그래서 문법 오류가 있으면 그 자리에서 파싱이 멈추고 오류 위치를 알려줍니다. 대표적으로 걸러지는 실수는 마지막 항목 뒤의 쉼표(trailing comma), 키를 감싸지 않은 따옴표, 작은따옴표 사용, 닫히지 않은 괄호입니다. JSON 표준은 키와 문자열에 반드시 큰따옴표를 요구하므로, 자바스크립트 객체 리터럴처럼 작은따옴표를 쓰면 오류로 처리됩니다.
들여쓰기 규칙
정렬 결과는 스페이스 2칸 들여쓰기로 고정 출력됩니다. 팀 컨벤션이 4칸이나 탭이라면 결과를 복사한 뒤 에디터에서 일괄 변환하면 그대로 저장소에 커밋할 수 있습니다. 참고로 JSON에서 객체 키의 순서는 의미가 없지만 배열 요소의 순서는 데이터 그 자체이므로, 정렬 과정에서 키·값과 배열 내부 순서는 입력한 그대로 보존됩니다.
이럴 때 씁니다
서버 응답이 한 줄로 뭉쳐 있어 어느 필드가 어디에 속하는지 안 보일 때, 크롬 개발자도구 Network 탭에서 복사한 응답을 검토할 때, 설정 파일(package.json, tsconfig 등)의 문법 오류를 빠르게 찾을 때 유용합니다. 특히 오류 메시지 없이 "JSON parse error"만 뜨는 상황에서, 이 도구에 붙여넣으면 몇 번째 위치에서 깨졌는지 짚어줘 디버깅 시간을 줄일 수 있습니다.
알아두면 좋은 팁
| 상황 | 대처 |
|---|---|
| 숫자가 큰 정수(19자리 이상) | 정밀도가 손실될 수 있어 문자열로 다루는 것이 안전 |
| 한글·이모지 포함 | UTF-8이면 그대로 유지, 별도 이스케이프 불필요 |
| 주석이 들어간 파일 | 표준 JSON은 주석 불허 — 오류 나면 주석부터 제거 |
| 맨 끝 쉼표 오류 | 배열·객체 마지막 요소 뒤 쉼표를 지우면 해결 |
자주 묻는 질문
입력한 JSON이 서버로 전송되나요?
이 포맷터는 브라우저 안에서 자바스크립트로 파싱·정렬을 처리하므로 데이터가 외부로 전송되지 않습니다. 사내 API 응답처럼 민감한 값도 붙여넣어 확인할 수 있습니다.
"Unexpected token" 오류는 무슨 뜻인가요?
파서가 예상하지 못한 문자를 만났다는 뜻입니다. 대개 작은따옴표 사용, 키에 따옴표 누락, 마지막 항목 뒤 쉼표, 괄호 짝이 맞지 않는 경우입니다. 오류가 가리키는 위치 근처를 먼저 확인하세요.
JSON5나 주석 포함 형식도 되나요?
표준 JSON만 지원합니다. JSON5, JSONC(주석 허용)처럼 확장 문법은 주석과 홑따옴표를 허용하지만, 표준 파서에서는 오류가 납니다. 이 경우 주석과 확장 문법을 제거한 뒤 사용하세요.
압축(한 줄)과 정렬 중 무엇을 언제 쓰나요?
사람이 읽고 검토·수정할 때는 정렬(들여쓰기)을, 네트워크 전송이나 파일 용량을 줄이려면 압축을 씁니다. 데이터 내용은 동일하며 공백만 차이 납니다.