JSON Formatter/Validator

JSON의 유효성을 검사하고 포맷팅하는 무료 온라인 도구입니다.

?JSON을 입력하세요

들여쓰기 크기:2 spaces4 spaces8 spaces

📝 입력 JSON

줄: 0문자: 0크기: 0 bytes

✨ 결과

JSON (JavaScript Object Notation)의 유효성을 검사하고 포맷팅합니다. 들여쓰기를 추가하여 가독성을 높이거나, 공백을 제거하여 크기를 줄일 수 있습니다.

JSON이란?

JSON (JavaScript Object Notation)은 경량 데이터 교환 형식입니다. 사람이 읽고 쓰기 쉽고, 기계가 파싱하고 생성하기 쉽습니다. 웹 API, 설정 파일, 데이터 저장 등에 널리 사용됩니다.

주요 기능

• 유효성 검사: JSON 문법 오류 실시간 감지
• 포맷팅 (Prettify): 들여쓰기 추가로 가독성 향상
• 압축 (Minify): 공백 제거로 크기 감소
• 실시간 통계: 줄 수, 문자 수, 바이트 크기 표시
• 들여쓰기 설정: 2/4/8 스페이스 선택
• 샘플 로드: 예제 JSON으로 빠른 테스트

사용 방법

JSON 유효성 검사

1. JSON을 입력 영역에 붙여넣습니다
2. 실시간으로 유효성이 검사됩니다
3. 오류가 있으면 상세한 오류 메시지가 표시됩니다

JSON 포맷팅

1. JSON을 입력합니다
2. 들여쓰기 크기를 선택합니다 (2/4/8 spaces)
3. "포맷팅" 버튼을 클릭합니다
4. 정돈된 JSON이 출력됩니다

JSON 압축

1. JSON을 입력합니다
2. "압축" 버튼을 클릭합니다
3. 공백이 제거된 한 줄 JSON이 출력됩니다

JSON 기본 문법

데이터 타입

1. 객체 (Object)

{
  "name": "John",
  "age": 30
}

2. 배열 (Array)

["apple", "banana", "orange"]

3. 문자열 (String)

"Hello World"

4. 숫자 (Number)

42
3.14
-10

5. 불린 (Boolean)

true
false

6. null

null

중첩 구조

{
  "user": {
    "name": "John Doe",
    "age": 30,
    "emails": ["john@example.com", "doe@example.com"],
    "address": {
      "city": "New York",
      "country": "USA"
    },
    "active": true,
    "lastLogin": null
  }
}

일반적인 JSON 오류

1. 후행 쉼표 (Trailing Comma)

// ❌ 잘못됨
{
  "name": "John",
  "age": 30,  ← 마지막 쉼표
}

// ✅ 올바름
{
  "name": "John",
  "age": 30
}

2. 따옴표 누락

// ❌ 잘못됨
{
  name: "John"  ← 키에 따옴표 없음
}

// ✅ 올바름
{
  "name": "John"
}

3. 작은따옴표 사용

// ❌ 잘못됨
{
  'name': 'John'  ← 작은따옴표
}

// ✅ 올바름
{
  "name": "John"
}

4. 주석 사용

// ❌ 잘못됨
{
  // 이것은 주석입니다
  "name": "John"
}

// ✅ JSON은 주석을 지원하지 않음
// JSONC 또는 JSON5 사용 필요

5. 정의되지 않은 값

// ❌ 잘못됨
{
  "name": "John",
  "age": undefined  ← undefined는 JSON에 없음
}

// ✅ 올바름 (null 사용)
{
  "name": "John",
  "age": null
}

사용 사례

1. API 응답 디버깅

// API에서 받은 응답을 포맷팅하여 확인
{
  "status": "success",
  "data": {
    "users": [
      {"id": 1, "name": "John"},
      {"id": 2, "name": "Jane"}
    ]
  }
}

2. 설정 파일 작성

// package.json, tsconfig.json 등
{
  "name": "my-app",
  "version": "1.0.0",
  "dependencies": {
    "react": "^18.0.0"
  }
}

3. 데이터 저장

// 로컬 스토리지, 파일 저장 등
{
  "theme": "dark",
  "language": "ko",
  "notifications": true
}

4. 로그 분석

// 구조화된 로그
{
  "timestamp": 1640995200,
  "level": "error",
  "message": "Connection failed",
  "details": {
    "host": "api.example.com",
    "port": 443
  }
}

5. 테스트 데이터

// 목(mock) 데이터 생성
{
  "users": [
    {"id": 1, "name": "Test User 1"},
    {"id": 2, "name": "Test User 2"}
  ]
}

프로그래밍 언어별 사용법

JavaScript

// JSON → 객체 (파싱)
const obj = JSON.parse('{"name":"John","age":30}');
console.log(obj.name); // "John"

// 객체 → JSON (문자열화)
const json = JSON.stringify(obj);
console.log(json); // '{"name":"John","age":30}'

// 포맷팅 (들여쓰기 2칸)
const formatted = JSON.stringify(obj, null, 2);

Python

import json

# JSON → 딕셔너리
data = json.loads('{"name":"John","age":30}')
print(data['name'])  # "John"

# 딕셔너리 → JSON
json_str = json.dumps(data)

# 포맷팅
formatted = json.dumps(data, indent=2)

PHP

<?php
// JSON → 배열
$data = json_decode('{"name":"John","age":30}', true);
echo $data['name'];  // "John"

// 배열 → JSON
$json = json_encode($data);

// 포맷팅
$formatted = json_encode($data, JSON_PRETTY_PRINT);
?>

Java

import com.google.gson.Gson;
import com.google.gson.GsonBuilder;

// JSON → 객체
Gson gson = new Gson();
User user = gson.fromJson(jsonString, User.class);

// 객체 → JSON
String json = gson.toJson(user);

// 포맷팅
Gson prettyGson = new GsonBuilder().setPrettyPrinting().create();
String formatted = prettyGson.toJson(user);

C#

using System.Text.Json;

// JSON → 객체
var user = JsonSerializer.Deserialize<User>(jsonString);

// 객체 → JSON
var json = JsonSerializer.Serialize(user);

// 포맷팅
var options = new JsonSerializerOptions { WriteIndented = true };
var formatted = JsonSerializer.Serialize(user, options);

포맷팅 vs 압축

포맷팅 (Prettify)

장점:

• 사람이 읽기 쉬움
• 디버깅 용이
• 구조 파악 쉬움

단점:

• 파일 크기 증가
• 네트워크 전송 시 비효율

사용 시기:

• 개발/디버깅
• 설정 파일
• 문서화

압축 (Minify)

장점:

• 파일 크기 감소 (약 30-50%)
• 네트워크 전송 효율
• 저장 공간 절약

단점:

• 사람이 읽기 어려움
• 디버깅 어려움

사용 시기:

• 프로덕션 환경
• API 응답
• 대용량 데이터

실용적인 팁

1. 큰 JSON 파일 처리

// 스트리밍 파싱 사용
const stream = fs.createReadStream('large.json');
const parser = JSONStream.parse('*');
stream.pipe(parser);

2. 순환 참조 처리

const obj = {};
obj.self = obj; // 순환 참조

// 에러 발생
// JSON.stringify(obj); // TypeError

// 커스텀 replacer로 해결
const json = JSON.stringify(obj, (key, value) => {
  if (key === 'self') return undefined;
  return value;
});

3. Date 객체 처리

const data = {
  name: "John",
  created: new Date()
};

// Date → ISO 8601 문자열
const json = JSON.stringify(data);
// {"name":"John","created":"2022-01-01T00:00:00.000Z"}

4. 특정 필드만 직렬화

const user = {
  name: "John",
  password: "secret",
  age: 30
};

// password 제외
const json = JSON.stringify(user, ['name', 'age']);
// {"name":"John","age":30}

5. 압축 전후 비교

const data = { /* 복잡한 객체 */ };

const formatted = JSON.stringify(data, null, 2);
console.log(formatted.length); // 1500

const minified = JSON.stringify(data);
console.log(minified.length); // 850

// 약 43% 감소!

JSON vs 다른 형식

JSON vs XML

특징	JSON	XML
가독성	더 간결	더 장황
파싱 속도	빠름	느림
데이터 타입	네이티브 지원	문자열만
속성	없음	있음
주석	없음	있음

JSON vs YAML

특징	JSON	YAML
가독성	중간	매우 좋음
문법	엄격	유연
주석	없음	있음
복잡한 구조	가능	더 쉬움
파싱 속도	빠름	느림

자주 묻는 질문

Q: JSON에 주석을 추가할 수 있나요?

표준 JSON은 주석을 지원하지 않습니다. 대안:

• JSONC: VS Code 등에서 사용하는 주석 지원 JSON
• JSON5: JavaScript 스타일 주석 지원

Q: JSON의 최대 크기는?

이론적 제한은 없지만 실용적으로:

• 브라우저: 약 10-100 MB (브라우저마다 다름)
• Node.js: 약 512 MB (V8 엔진 기본값)
• 메모리 제한: 시스템 메모리에 따라 다름

Q: JSON에서 날짜를 어떻게 표현하나요?

표준 방법은 ISO 8601 문자열:

{"date": "2022-01-01T00:00:00.000Z"}

Q: JSON에서 undefined와 null의 차이는?

• null: JSON에서 유효한 값
• undefined: JSON에서 지원하지 않음 (생략되거나 null로 변환)

Q: 포맷팅하면 성능이 느려지나요?

약간 느려지지만 무시할 수 있는 수준입니다. 개발 중에는 포맷팅, 프로덕션에서는 압축 사용 권장.

Q: JSON 파일에 BOM이 있으면 어떻게 하나요?

BOM (Byte Order Mark)은 제거해야 합니다:

const json = text.replace(/^\uFEFF/, '');

관련 도구

• Base64 인코더 - JSON을 Base64로 인코딩
• URL 인코더 - JSON을 URL에 안전하게 인코딩
• 텍스트 비교 - 두 JSON 비교

성능

• 파싱 속도: 밀리초 미만 (일반 크기)
• 포맷팅 속도: 즉시
• 압축 속도: 즉시
• 메모리 사용: 최소

브라우저 호환성

JSON.parse()와 JSON.stringify()는 모든 현대 브라우저에서 지원됩니다:

• Chrome (모든 버전) ✓
• Firefox (모든 버전) ✓
• Safari (모든 버전) ✓
• Edge (모든 버전) ✓
• IE 8+ ✓

개인정보 보호

이 도구는 완전히 클라이언트 측에서 작동합니다. 입력한 JSON은 서버로 전송되지 않으며, 브라우저에서만 처리됩니다.

🔗 다음으로 사용해보세요

• Base64 Encoder - JSON을 Base64로 인코딩
• CSV-JSON Converter - CSV와 JSON 상호 변환
• API Tester - REST API 엔드포인트 테스트
• URL Encoder - JSON을 URL에 안전하게 인코딩

💬 이 도구가 도움이 되었나요?

궁금한 점이나 개선 제안이 있으시면 언제든 피드백을 주세요!