JSON 포맷팅은 어떻게 하나요?

JSON 데이터를 온라인 포맷터에 붙여넣으면 자동으로 들여쓰기와 구문 강조가 적용되어 읽기 쉬운 형태로 변환됩니다.

온라인 JSON 포맷터는 안전한가요?

ToolPal의 JSON 포맷터는 모든 처리가 브라우저에서 이루어져 데이터가 서버로 전송되지 않으므로 완전히 안전합니다.

JSON과 XML의 차이점은 무엇인가요?

JSON은 경량 데이터 형식으로 가독성이 좋고 파싱이 빠르며, XML은 더 복잡한 구조와 스키마 검증을 지원하지만 파일 크기가 더 큽니다.

JSON 포맷 온라인으로 하는 방법 - 완벽 가이드

JSON이란?

JSON(JavaScript Object Notation)은 사람이 읽고 쓰기 쉬우며, 기계가 파싱하고 생성하기 쉬운 경량 데이터 교환 형식입니다. API 응답, 설정 파일, 현대 웹 개발의 데이터 저장에서 가장 많이 사용되는 형식입니다.

API를 다루는 일을 한다면, JSON을 끊임없이 접하게 됩니다. 모든 REST API 응답, 모든 웹훅 페이로드, Node.js 프로젝트의 모든 설정 파일이 높은 확률로 JSON입니다. JSON을 읽고, 포맷하고, 디버깅하는 것은 핵심 개발자 기술입니다.

왜 JSON을 포맷해야 할까요?

압축된(minified) JSON은 읽기 어렵습니다. API 응답은 종종 공백 없이 한 줄로 도착하는데, 디버깅할 때 이것은 악몽입니다. JSON을 포맷(또는 "pretty-print")하면 적절한 들여쓰기와 줄바꿈이 추가되어 구조를 쉽게 파악할 수 있습니다.

포맷 전:

{"name":"홍길동","age":30,"city":"서울","hobbies":["독서","코딩"],"address":{"street":"강남대로 123","zip":"06000"}}

포맷 후:

{
  "name": "홍길동",
  "age": 30,
  "city": "서울",
  "hobbies": [
    "독서",
    "코딩"
  ],
  "address": {
    "street": "강남대로 123",
    "zip": "06000"
  }
}

차이가 극적입니다. 포맷된 버전에서는 최상위 키가 5개이고, hobbies가 2개 항목을 가진 배열이며, address가 중첩 객체라는 것을 즉시 알 수 있습니다. 압축된 버전에서는 일치하는 중괄호와 대괄호를 시각적으로 파싱해야 합니다.

JSON 포맷터 사용법

JSON을 붙여넣기 - 입력 필드에 JSON 데이터를 붙여넣으세요
"포맷" 클릭 - 2칸 또는 4칸 들여쓰기로 정리
"최소화" 클릭 - JSON을 한 줄로 압축
결과 복사 - 한 번의 클릭으로 복사

붙여넣는 즉시 JSON을 검증하므로, 문제가 있으면 바로 피드백을 받을 수 있습니다.

자주 발생하는 JSON 오류 (해결 방법 포함)

JSON은 엄격한 구문 규칙을 가지고 있으며, 어느 하나라도 위반하면 파싱 오류가 발생합니다. 실무에서 가장 자주 보는 순서대로 정리합니다:

1. 후행 쉼표

가장 흔한 JSON 오류입니다. JavaScript는 배열과 객체에서 후행 쉼표를 허용하기 때문에, 개발자들이 JSON에서는 허용되지 않는다는 사실을 자주 잊습니다.

// 잘못됨 -- "코딩" 뒤에 후행 쉼표
{
  "hobbies": ["독서", "코딩",]
}

// 올바름
{
  "hobbies": ["독서", "코딩"]
}

2. 쌍따옴표 대신 작은따옴표

JSON은 모든 문자열에 쌍따옴표를 요구합니다. JavaScript와 Python에서 유효한 작은따옴표는 JSON 파싱을 깨뜨립니다.

// 잘못됨
{'name': '홍길동'}

// 올바름
{"name": "홍길동"}

3. 키에 따옴표 누락

JavaScript에서는 객체 키에 따옴표가 필요 없지만(특수 문자가 없는 경우), JSON에서는 모든 키가 쌍따옴표로 감싸진 문자열이어야 합니다.

// 잘못됨
{name: "홍길동", age: 30}

// 올바름
{"name": "홍길동", "age": 30}

4. JSON의 주석

JSON은 주석을 지원하지 않습니다. JSON이 JavaScript처럼 보이고 JavaScript는 주석을 지원하기 때문에 사람들이 당황합니다. 설정 파일에 주석이 필요하다면 JSONC(JSON with Comments, VS Code에서 지원) 또는 YAML을 사용하세요.

// 잘못됨
{
  "port": 3000,  // 서버 포트
  "host": "localhost"
}

// 올바름
{
  "port": 3000,
  "host": "localhost"
}

5. 이스케이프되지 않은 특수 문자

백슬래시, 쌍따옴표 또는 제어 문자를 포함하는 문자열은 적절히 이스케이프해야 합니다:

// 잘못됨 -- 이스케이프되지 않은 백슬래시와 따옴표
{"path": "C:\Users\hong", "note": "그가 "안녕"이라고 했다"}

// 올바름
{"path": "C:\\Users\\hong", "note": "그가 \"안녕\"이라고 했다"}

6. 유효하지 않은 값

JSON은 정확히 이 값 유형만 지원합니다: 문자열, 숫자, 불리언(true/false), null, 객체, 배열. 그 외는 유효하지 않습니다:

// 잘못됨
{"value": undefined}
{"count": NaN}
{"total": Infinity}
{"date": new Date()}

// 올바른 대안
{"value": null}
{"count": 0}
{"total": 9999999}
{"date": "2026-03-15T10:30:00Z"}

커맨드 라인에서 JSON 포맷팅

웹 기반 도구에 접근할 수 없거나, 스크립트의 일부로 JSON을 포맷해야 할 때 유용한 커맨드 라인 방법들입니다:

Python 사용 (대부분의 시스템에 설치됨)

# JSON 파일 포맷
python3 -m json.tool input.json

# 파이프로 JSON 포맷
curl -s https://api.example.com/data | python3 -m json.tool

# 커스텀 들여쓰기로 포맷
python3 -c "import json,sys; print(json.dumps(json.load(sys.stdin), indent=4))" &lt; input.json

jq 사용 (JSON의 만능 도구)

jq는 전용 JSON 프로세서이며, 커맨드 라인에서 JSON을 다루는 가장 강력한 도구입니다:

# 보기 좋게 출력
cat data.json | jq '.'

# 포맷하고 특정 필드 추출
cat data.json | jq '.users[0].name'

# API 응답 포맷
curl -s https://api.example.com/users | jq '.'

JSON을 자주 다루면서 jq가 설치되어 있지 않다면, 지금 바로 설치하세요. 수많은 시간을 절약해줄 것입니다.

Node.js 사용

# 빠른 포맷
node -e "console.log(JSON.stringify(JSON.parse(require('fs').readFileSync('/dev/stdin','utf8')),null,2))" &lt; input.json

JSON 작업 팁

들여쓰기를 현명하게 선택하세요

2칸 들여쓰기: 더 간결하고 화면에 더 많이 보입니다. JavaScript/TypeScript 프로젝트와 대부분의 웹 프레임워크에서 인기있습니다. 대부분의 API 문서에서 사용합니다.
4칸 들여쓰기: 깊게 중첩된 구조에서 읽기 더 쉽습니다. Python 프로젝트와 엔터프라이즈 Java 환경에서 흔합니다.
탭 들여쓰기: 기술적으로 유효하지만 JSON에서는 드뭅니다. 스페이스를 사용하세요.

대부분의 웹 개발에서 2칸이 실용적인 선택입니다. 충분한 시각적 계층을 제공하면서 가로 공간을 낭비하지 않습니다.

배포 전 검증하기

프로덕션에서 사용하기 전에 항상 JSON을 검증하세요. 특히 수동으로 작성하거나 스크립트로 수정한 경우 더욱 그렇습니다. 쉼표 하나나 괄호 하나가 전체 애플리케이션을 중단시킬 수 있습니다. 우리 포맷터는 붙여넣는 즉시 구문 오류를 감지하여 빠르게 데이터를 점검할 수 있습니다.

구조화된 검증에 JSON Schema 사용하기

JSON 입력을 받는 API를 구축한다면, 단순 파싱만으로는 부족합니다. JSON Schema로 예상 구조, 타입, 제약 조건을 정의할 수 있습니다:

{
  "$schema": "https://json-schema.org/draft/2020-12/schema",
  "type": "object",
  "properties": {
    "name": { "type": "string", "minLength": 1 },
    "age": { "type": "integer", "minimum": 0 },
    "email": { "type": "string", "format": "email" }
  },
  "required": ["name", "email"]
}

필수 필드 누락, 잘못된 타입, 허용 범위 밖의 값 같은 문제를 잡아냅니다. 기본 JSON 파싱에서는 발견하지 못하는 것들입니다.

일관성을 위한 키 정렬

두 JSON 객체를 비교할 때(코드 리뷰나 설정 diff 등), 정렬되지 않은 키는 diff를 복잡하게 만듭니다. 우리 포맷터를 포함한 많은 포맷터가 객체 키를 재귀적으로 알파벳순으로 정렬하는 옵션을 제공합니다. 특히 유용한 경우:

버전 관리의 설정 파일 (의미 없는 diff 감소)
디버깅 중 API 응답 비교
결정적이어야 하는 테스트 스냅샷

실전 JSON 디버깅 시나리오

API 응답 디버깅

curl 요청을 보냈더니 압축된 JSON 한 줄이 돌아왔습니다. 무엇이 잘못되었는지 이해하려면 먼저 구조를 봐야 합니다:

curl -s https://api.example.com/users/123 | jq '.'

또는 응답을 JSON 포맷터에 붙여넣으세요. 응답 구조에 문제가 있는지, 필드가 누락되었는지, 예상치 못한 값이 있는지 확인할 수 있습니다.

두 JSON 객체 비교

동일해야 하는 두 API 응답이 있지만 무언가 다릅니다. 둘 다 키를 정렬하여 포맷한 다음 diff 도구를 사용합니다:

jq -S '.' response1.json > sorted1.json
jq -S '.' response2.json > sorted2.json
diff sorted1.json sorted2.json

-S 플래그는 키를 알파벳순으로 정렬하여 구조적 차이가 diff에 노이즈를 만들지 않게 합니다.

복사-붙여넣기 오류 수정

동료가 Slack에 JSON을 붙여넣었는데, 스마트 따옴표가 내용을 망가뜨렸습니다. 포맷터에 붙여넣으면 오류(직선 따옴표 대신 둥근 따옴표)를 강조해주어 정확히 무엇을 고쳐야 하는지 알 수 있습니다.

생각보다 자주 발생합니다. 채팅 앱, 워드 프로세서, 일부 텍스트 편집기도 "를 둥근 따옴표로 자동 변환하는데, 이것은 JSON에서 유효하지 않습니다.

대용량 JSON 파일에서 데이터 추출

메가바이트 크기의 JSON 파일을 받았는데 작은 부분만 필요할 때가 있습니다. 수천 줄을 스크롤하는 대신 jq로 필요한 것만 정확히 추출합니다:

# 첫 번째 사용자의 이메일 가져오기
cat users.json | jq '.data.users[0].email'

# 모든 사용자 이름을 평면 리스트로
cat users.json | jq '[.data.users[].name]'

# 상태로 사용자 필터링
cat users.json | jq '[.data.users[] | select(.status == "active")]'

JSON vs 다른 데이터 형식

특성	JSON	YAML	XML	TOML
가독성	좋음	매우 좋음	보통	좋음
주석	불가	가능	가능	가능
데이터 타입	기본적	풍부	문자열 기반	풍부
파일 크기	작음	작음	큼	작음
파싱 속도	빠름	보통	느림	빠름
생태계	거대	큼	큼	성장 중

JSON은 단순성과 범용 파서 지원 덕분에 API 통신과 데이터 교환에서 승리합니다. YAML은 주석과 가독성이 중요한 설정 파일에 더 적합합니다. XML은 엔터프라이즈 시스템과 문서 형식에서 여전히 자리를 지키고 있습니다. TOML은 설정 파일에서 점유율이 높아지고 있습니다(Rust의 Cargo, Python의 pyproject.toml).

보안 고려사항

서버 사이드 포맷터에 민감한 데이터를 붙여넣지 마세요

일부 온라인 JSON 포맷터는 데이터를 서버로 보내서 처리합니다. API 키, 토큰, 비밀번호 또는 개인 데이터를 다루고 있다면, 모든 것을 브라우저에서 처리하는 클라이언트 사이드 포맷터만 사용하세요. 우리 도구는 모든 포맷팅을 로컬에서 수행합니다. 아무것도 외부로 전송되지 않습니다.

JSON 인젝션 주의

JSON 입력을 받는 애플리케이션을 구축할 때, 항상 데이터를 검증하고 정제하세요. 문자열 연결로 JSON을 만들지 마세요:

// 위험 -- JSON 인젝션 위험
const json = '{"name": "' + userInput + '"}';

// 안전
const json = JSON.stringify({ name: userInput });

신뢰할 수 없는 데이터의 JSON.parse에 주의

JSON.parse()는 일반적으로 안전하지만(eval()과 달리), 파싱된 데이터가 예상치 못한 타입이나 구조를 가질 수 있습니다. 애플리케이션에서 사용하기 전에 항상 파싱된 JSON의 형태를 검증하세요.

무료 JSON 포맷터로 지금 바로 JSON 데이터를 포맷해보세요! 브라우저에서 완전히 실행되며, 구문 강조를 지원하고, 입력하는 즉시 오류를 감지합니다.