JSON 포매터/검증기

JSON 데이터를 깔끔하게 포매팅하고 실시간으로 유효성을 검증하세요.
트리 뷰, JSON 비교, TypeScript/CSV/YAML 변환까지 한 곳에서 처리할 수 있습니다.

들여쓰기:

📝 입력

1

📄 결과

포매팅 결과가 여기에 표시됩니다
JSON을 입력하면 자동으로 검증됩니다

JSON 포매터 활용 가이드

API 개발

  • API 응답 데이터 확인 및 디버깅
  • 요청 바디 JSON 검증
  • TypeScript 타입 자동 생성

설정 파일 관리

  • package.json, tsconfig.json 정리
  • 설정 파일 비교 (Diff)
  • YAML, XML 형식으로 변환

데이터 분석

  • JSON 구조 트리 뷰로 시각화
  • 배열 데이터를 CSV로 변환
  • 데이터 구조 파악 및 통계 확인

💡 활용 팁

키보드 단축키
Ctrl+Shift+F로 포매팅, Ctrl+Shift+M으로 축소, Ctrl+Shift+C로 복사할 수 있습니다.
자동 수정
후행 쉼표, 작은따옴표, 주석 등 흔한 오류를 자동으로 수정해줍니다.
트리 뷰 활용
복잡한 중첩 구조를 시각적으로 확인하고 JSONPath 경로를 복사하세요.
히스토리 저장
자주 사용하는 JSON은 히스토리에 저장해두면 빠르게 불러올 수 있습니다.

JSON 포매터/검증기란 무엇인가요?

JSON 포매터/검증기는 JSON(JavaScript Object Notation) 데이터를 깔끔하게 정리하고,
실시간으로 유효성을 검사하는 온라인 도구입니다.
개발자, 기획자, QA 엔지니어 등 JSON 데이터를 다루는 모든 분에게 필수적인 유틸리티입니다.

붙여넣기 한 번으로 JSON을 자동 포매팅하고, 구문 오류를 한글로 안내받을 수 있습니다.
트리 뷰 시각화, JSON 비교(Diff), TypeScript 타입 생성, CSV/YAML/XML 변환까지 지원하여
별도의 프로그램 설치 없이 브라우저에서 모든 작업을 처리할 수 있습니다.

이런 분들에게 유용합니다

  • • API 응답 데이터를 확인하고 디버깅하는 백엔드 개발자
  • • REST API 요청 바디를 작성하고 검증하는 프론트엔드 개발자
  • • package.json이나 tsconfig.json 등 설정 파일을 관리하는 DevOps 엔지니어
  • • JSON 데이터를 CSV로 변환하여 분석하는 데이터 분석가
  • • API 명세서의 요청/응답 예시를 확인하는 기획자
  • • 테스트 데이터를 작성하고 검증하는 QA 엔지니어
  • • JSON 기반 데이터를 다루는 모든 직군의 IT 종사자

주요 기능 안내

1. JSON 포매팅 (Pretty Print)

압축되거나 한 줄로 이어진 JSON 데이터를 보기 좋게 정리합니다.
들여쓰기 옵션(2칸, 4칸, 탭)을 선택할 수 있으며, 키를 알파벳순으로 정렬하는 기능도 제공합니다.
유니코드 이스케이프 문자(\uXXXX)를 자동으로 한글로 변환하여 가독성을 높입니다.

포매팅 전

{"name":"홍길동","age":28,"city":"서울"}

포매팅 후

{
  "name": "홍길동",
  "age": 28,
  "city": "서울"
}

2. JSON 축소 (Minify)

반대로, 포매팅된 JSON에서 모든 공백과 줄바꿈을 제거하여 최소 크기로 압축합니다.
API 요청 시 전송 데이터 크기를 줄이거나, 저장 공간을 절약할 때 유용합니다.
원본 대비 압축률(%)을 자동으로 계산하여 보여줍니다.

3. 실시간 유효성 검증

JSON을 입력하는 즉시 유효성을 검사하여 결과를 표시합니다.
구문 오류가 발생하면 해당 줄 번호와 한글 에러 메시지를 함께 안내합니다.
후행 쉼표, 작은따옴표, 주석 등 흔한 실수도 자동으로 감지하고 수정 버튼을 제공합니다.

감지되는 오류 유형

  • 구문 오류: 잘못된 JSON 문법 (누락된 괄호, 콜론 등)
  • 후행 쉼표: 마지막 요소 뒤의 불필요한 쉼표 → 자동 수정 가능
  • 작은따옴표: JSON 표준은 큰따옴표만 허용 → 자동 수정 가능
  • 주석: JSON에서는 주석 사용 불가 → 자동 제거 가능
  • 중복 키: 동일 객체 내 같은 이름의 키 → 경고 표시

4. 트리 뷰 시각화

JSON 데이터를 트리 형태로 시각화하여 계층 구조를 한눈에 파악할 수 있습니다.
각 노드를 접거나 펼 수 있으며, 데이터 타입별로 색상이 구분됩니다.
노드를 클릭하면 해당 경로(JSONPath)가 클립보드에 복사되어 코드에서 바로 활용할 수 있습니다.

  • 문자열(string): 초록색으로 표시
  • 숫자(number): 주황색으로 표시
  • 불린(boolean): 보라색으로 표시
  • null: 회색으로 표시
  • 객체/배열: 파란색으로 자식 수 표시

5. JSON 비교 (Diff)

두 개의 JSON 데이터를 입력하면 차이점을 자동으로 분석합니다.
추가된 항목은 초록색, 삭제된 항목은 빨간색, 변경된 항목은 노란색으로 구분됩니다.
키 순서와 무관하게 의미적 차이만 비교하므로 정확한 결과를 얻을 수 있습니다.

API 버전 업그레이드 시 응답 구조 변경점을 파악하거나,
설정 파일의 수정 사항을 검토할 때 매우 유용합니다.

6. 형식 변환

JSON 데이터를 다른 형식으로 변환할 수 있습니다.
변환된 결과를 클립보드에 복사하거나 파일로 다운로드할 수 있습니다.

  • TypeScript 타입: JSON 구조에서 interface를 자동 생성하여 타입 안전성을 확보합니다.
  • CSV: 배열 형태의 JSON을 스프레드시트에서 열 수 있는 CSV로 변환합니다.
  • YAML: 설정 파일에 많이 사용되는 YAML 형식으로 변환합니다.
  • XML: 레거시 시스템과 연동 시 필요한 XML 형식으로 변환합니다.
  • 쿼리스트링: URL 파라미터 형식으로 변환하여 GET 요청에 활용합니다.

사용 방법

1단계: JSON 입력

포매팅 탭에서 JSON 데이터를 직접 입력하거나 붙여넣기(Ctrl+V)합니다.
샘플 데이터 버튼을 클릭하면 미리 준비된 예제를 바로 체험할 수 있습니다.

2단계: 자동 검증 확인

입력 즉시 유효성이 자동 검사됩니다.
유효한 JSON이면 초록색 배지가 표시되고, 오류가 있으면 줄 번호와 함께 한글 에러 메시지가 나타납니다.

3단계: 포매팅 또는 변환

'포매팅' 버튼으로 깔끔하게 정리하거나, '축소' 버튼으로 최소 크기로 압축합니다.
트리 뷰, 비교, 변환 탭에서 추가 기능을 활용할 수 있습니다.

4단계: 결과 활용

'복사' 버튼으로 클립보드에 복사하거나, '다운로드' 버튼으로 파일로 저장합니다.
히스토리에 저장해두면 나중에 다시 불러올 수 있습니다.

실무 활용 시나리오

API 디버깅 워크플로우

Postman이나 curl로 받은 API 응답을 붙여넣기하면 즉시 포매팅됩니다.
트리 뷰에서 데이터 구조를 파악하고, JSONPath로 필요한 데이터의 경로를 확인하세요.
TypeScript 변환 기능으로 API 응답 타입을 자동 생성하면 타입 안전한 코드를 빠르게 작성할 수 있습니다.

설정 파일 버전 비교

package.json이나 환경설정 파일을 수정한 후, 비교(Diff) 탭에서 이전 버전과 차이점을 확인하세요.
의도하지 않은 변경 사항이 없는지 빠르게 검토할 수 있습니다.
팀 협업 시 PR 리뷰에서 JSON 설정 변경사항을 정리할 때도 유용합니다.

데이터 마이그레이션

JSON 데이터를 CSV로 변환하여 엑셀에서 편집하거나,
YAML로 변환하여 Kubernetes 설정 파일에 활용할 수 있습니다.
XML 변환은 SOAP API나 레거시 시스템 연동 시 필요한 형식을 빠르게 생성합니다.

자주 묻는 질문 (FAQ)

Q. JSON과 JavaScript 객체의 차이는 무엇인가요?

A. JSON은 문자열 기반의 데이터 교환 형식으로, 모든 키가 큰따옴표로 감싸져야 합니다.
JavaScript 객체는 따옴표 없는 키, 후행 쉼표, 주석 등을 허용하지만 JSON에서는 사용할 수 없습니다.
이 도구의 자동 수정 기능을 사용하면 JavaScript 객체를 유효한 JSON으로 변환할 수 있습니다.

Q. 입력한 JSON 데이터는 서버에 전송되나요?

A. 아닙니다.
모든 처리가 브라우저 내에서 이루어지며, 서버로 데이터가 전송되지 않습니다.
민감한 정보가 포함된 JSON도 안심하고 사용할 수 있습니다.

Q. 대용량 JSON도 처리할 수 있나요?

A. 일반적인 사용 범위(수 MB 이하)에서 원활하게 동작합니다.
매우 큰 파일(10MB 이상)의 경우 브라우저 성능에 따라 처리 속도가 느려질 수 있습니다.
이 경우 필요한 부분만 복사하여 사용하는 것을 권장합니다.

Q. TypeScript 타입 생성이 정확한가요?

A. JSON 데이터의 현재 값을 기반으로 타입을 추론하므로, 대부분의 경우 정확합니다.
다만, 선택적(optional) 필드나 유니온 타입은 단일 데이터만으로는 판별이 어려울 수 있습니다.
생성된 타입을 기반으로 필요에 따라 수동으로 보완하시면 됩니다.

Q. CSV 변환은 어떤 구조의 JSON을 지원하나요?

A. 객체 배열(Array of Objects) 형태의 JSON을 CSV로 변환할 수 있습니다.
각 객체의 키가 CSV 헤더가 되고, 값이 각 행의 데이터가 됩니다.
중첩된 객체나 배열 값은 JSON 문자열 형태로 포함됩니다.

Q. 히스토리는 어디에 저장되나요?

A. 브라우저의 로컬 스토리지(LocalStorage)에 저장됩니다.
최근 10개까지 자동 보관되며, 브라우저 데이터를 삭제하면 함께 삭제됩니다.
다른 기기나 브라우저에서는 히스토리가 공유되지 않습니다.

JSON 작성 팁

  • 키는 항상 큰따옴표: JSON에서 모든 키와 문자열 값은 반드시 큰따옴표(")로 감싸야 합니다.
    작은따옴표(')나 백틱(`)은 사용할 수 없습니다.
  • 후행 쉼표 금지: 마지막 요소 뒤에 쉼표를 넣으면 구문 오류가 발생합니다.
    JavaScript에서는 허용되지만 JSON에서는 엄격하게 금지됩니다.
  • 주석 사용 불가: JSON은 데이터 교환 형식이므로 주석을 지원하지 않습니다.
    주석이 필요하다면 JSONC(JSON with Comments) 형식을 사용하세요.
  • 숫자 형식: 선행 0(예: 012)이나 16진수(0xFF)는 허용되지 않습니다.
    Infinity, NaN, undefined도 JSON에서 사용할 수 없습니다.
  • 중복 키 주의: 같은 레벨에서 동일한 키를 사용하면 마지막 값만 남습니다.
    대부분의 파서에서 오류 없이 처리되지만, 의도하지 않은 데이터 손실이 발생할 수 있습니다.

키보드 단축키

Ctrl+Shift+FJSON 포매팅
Ctrl+Shift+MJSON 축소
Ctrl+Shift+C결과 복사
Ctrl+L입력 초기화

Mac 사용자는 Ctrl 대신 Cmd 키를 사용하세요.

지금 바로 JSON을 정리하세요!

복잡한 JSON 데이터를 붙여넣기만 하면 깔끔하게 정리됩니다.

포매팅, 검증, 트리 뷰, 비교, 변환까지 — 모든 JSON 작업을 한 곳에서 처리하세요.