JSON이란?

JSON(JavaScript Object Notation)은 데이터를 저장하고 교환하기 위한 경량 텍스트 형식입니다. 2001년 Douglas Crockford가 제안했으며, 현재 웹 개발에서 가장 널리 사용되는 데이터 포맷입니다.

이름에 JavaScript가 들어있지만, 사실상 모든 프로그래밍 언어에서 지원합니다. Python, Java, Go, Rust, PHP 등 어떤 언어를 쓰든 JSON을 다루게 됩니다.

왜 JSON이 표준이 되었나?

JSON 이전에는 XML이 데이터 교환의 표준이었습니다. 하지만 JSON이 빠르게 대체한 이유가 있습니다.

JSON vs XML 비교

같은 데이터를 표현할 때의 차이를 보면:

// JSON (간결함)
{
  "name": "홍길동",
  "age": 30,
  "skills": ["JavaScript", "Python"]
}

// XML (장황함)
<person>
  <name>홍길동</name>
  <age>30</age>
  <skills>
    <skill>JavaScript</skill>
    <skill>Python</skill>
  </skills>
</person>

JSON의 장점은 명확합니다:

가독성: 사람이 읽기 쉬움
경량: 같은 데이터를 더 적은 용량으로 표현
파싱 속도: XML보다 파싱이 빠름
JavaScript 호환: 웹 환경에서 네이티브 지원

JSON 기본 문법

JSON은 6가지 데이터 타입을 지원합니다.

1. 문자열 (String)

반드시 큰따옴표로 감싸야 합니다. 작은따옴표는 허용되지 않습니다.

{ "name": "홍길동" }     // ✅ 올바름
{ "name": '홍길동' }     // ❌ 작은따옴표 불가
{ name: "홍길동" }       // ❌ 키에도 큰따옴표 필수

2. 숫자 (Number)

정수와 소수 모두 가능하며, 따옴표 없이 사용합니다.

{ "age": 30, "height": 175.5, "score": -10 }

3. 불린 (Boolean)

소문자 true, false만 허용됩니다.

{ "active": true, "deleted": false }

4. null

값이 없음을 나타냅니다. undefined는 JSON에서 사용할 수 없습니다.

{ "middleName": null }

5. 배열 (Array)

대괄호로 감싸며, 서로 다른 타입을 혼합할 수 있습니다.

{ "tags": ["개발", "프론트엔드", 42, true, null] }

6. 객체 (Object)

중괄호로 감싸며, 중첩이 가능합니다.

{
  "user": {
    "name": "홍길동",
    "address": {
      "city": "서울",
      "zip": "06000"
    }
  }
}

실무에서 자주 하는 실수 TOP 5

1. 마지막 쉼표 (Trailing Comma)

JavaScript에서는 허용되지만, JSON에서는 문법 오류입니다.

// ❌ 마지막 쉼표
{ "a": 1, "b": 2, }

// ✅ 올바름
{ "a": 1, "b": 2 }

2. 주석 사용

JSON은 주석을 지원하지 않습니다. 설정 파일에서 주석이 필요하다면 JSONC나 YAML을 고려하세요.

// ❌ 주석 불가
{
  // 사용자 이름
  "name": "홍길동"
}

// ✅ 대안: 별도 필드로 설명
{
  "_comment": "사용자 정보",
  "name": "홍길동"
}

3. 작은따옴표 사용

Python 딕셔너리를 그대로 복사하면 자주 발생합니다.

4. undefined 사용

JSON.stringify()는 undefined 값을 가진 키를 자동으로 제거합니다.

JSON.stringify({ a: 1, b: undefined })
// 결과: '{"a":1}'  (b가 사라짐)

5. 날짜 처리

JSON에는 Date 타입이 없습니다. ISO 8601 문자열을 사용하세요.

{ "createdAt": "2025-01-15T09:30:00Z" }

JSON 실무 활용 패턴

API 응답 설계

RESTful API에서 일관된 JSON 응답 구조를 사용하면 프론트엔드 개발이 편해집니다.

// 성공 응답
{
  "success": true,
  "data": { "id": 1, "name": "홍길동" },
  "meta": { "page": 1, "total": 100 }
}

// 에러 응답
{
  "success": false,
  "error": {
    "code": "NOT_FOUND",
    "message": "사용자를 찾을 수 없습니다"
  }
}

설정 파일

package.json, tsconfig.json, .eslintrc.json 등 개발 도구의 설정 파일로 널리 사용됩니다.

데이터 저장

MongoDB는 BSON(Binary JSON)을 사용하고, Firebase Realtime Database는 JSON 트리 구조로 데이터를 저장합니다.

JSON 성능 최적화 팁

키 이름 줄이기: API 응답에서 "userName" 대신 "name"을 사용하면 전송량이 줄어듭니다
Minify: 프로덕션에서는 공백과 줄바꿈을 제거하여 용량을 줄이세요
Gzip 압축: 서버에서 JSON 응답을 gzip으로 압축하면 70~80% 용량 절감
필요한 필드만 반환: GraphQL이나 필드 필터링으로 불필요한 데이터 전송을 줄이세요
페이지네이션: 대량 데이터는 한 번에 보내지 말고 페이지 단위로 나누세요

유용한 JSON 관련 도구

JSON 작업을 더 효율적으로 하려면 다음 도구들을 활용해보세요:

JSON Formatter — JSON 포맷팅, 유효성 검사, 압축
YAML ↔ JSON 변환기 — YAML과 JSON 간 변환
JWT 디코더 — JWT 토큰의 JSON 페이로드 확인
정규식 테스터 — JSON 데이터에서 패턴 매칭

마무리

JSON은 단순하지만 강력한 데이터 포맷입니다. 기본 문법을 정확히 이해하고, 실무에서의 패턴과 주의사항을 숙지하면 더 효율적인 개발이 가능합니다.

JSON 데이터를 다룰 때 문법 오류가 의심된다면, JSON Formatter로 빠르게 검증해보세요.

JSON 완벽 정리: 개발자가 알아야 할 모든 것

JSON이란?

왜 JSON이 표준이 되었나?

JSON vs XML 비교

JSON 기본 문법

1. 문자열 (String)

2. 숫자 (Number)

3. 불린 (Boolean)

4. null

5. 배열 (Array)

6. 객체 (Object)

실무에서 자주 하는 실수 TOP 5

1. 마지막 쉼표 (Trailing Comma)

2. 주석 사용

3. 작은따옴표 사용

4. undefined 사용

5. 날짜 처리

JSON 실무 활용 패턴

API 응답 설계

설정 파일

데이터 저장

JSON 성능 최적화 팁

유용한 JSON 관련 도구

마무리

📖 다른 글도 읽어보세요

JSON이란?

왜 JSON이 표준이 되었나?

JSON vs XML 비교

JSON 기본 문법

1. 문자열 (String)

2. 숫자 (Number)

3. 불린 (Boolean)

4. null

5. 배열 (Array)

6. 객체 (Object)

실무에서 자주 하는 실수 TOP 5

1. 마지막 쉼표 (Trailing Comma)

2. 주석 사용

3. 작은따옴표 사용

4. undefined 사용

5. 날짜 처리

JSON 실무 활용 패턴

API 응답 설계

설정 파일

데이터 저장

JSON 성능 최적화 팁

유용한 JSON 관련 도구

마무리

🔧 관련 도구

📖 다른 글도 읽어보세요