본문 바로가기
프레임워크/웹 지식

AJAX와 CSV, XML, JSON, YAML

by 클레어몬트 2024. 10. 4.

"데이터를 저장하고 전송하기 위한 포맷을" 알아볼 거다. 각각의 포맷은 데이터 표현 방식과 사용 목적에 따라 장단점이 있어서, 필요에 맞는 포맷을 선택하는 게 중요하다. 이번 포스팅에서는 대표적인 데이터 포맷인 CSV, XML, JSON, YAML 그리고 AJAX에 대해 살펴보겠다.

 

ㅇCSV(Comma-Separated Values): 콤마 기준

각 행은 레코드를 나타내며, 각 필드는 쉼표로 구분된다. 주로 스프레드시트 프로그램이나 데이터베이스 간의 데이터 이동에 사용된다.

이름,나이,직업,도시
홍길동,30,개발자,서울
김철수,25,디자이너,부산
이영희,28,마케터,대구

장점

  • 단순성: 구조가 간단하여 작성과 읽기가 용이하다.
  • 호환성: 대부분의 데이터 처리 도구와 프로그램에서 지원된다.
  • 경량성: 불필요한 메타데이터가 없어 파일 크기가 작다.

단점

  • 제한된 구조 표현: 계층적 데이터나 복잡한 데이터 구조를 표현하기 어렵다.
  • 데이터 타입 미지원: 모든 데이터가 문자열로 처리되기 때문에 데이터 타입을 명시할 수 없다.
  • 구분자 충돌: 필드 내에 쉼표가 포함될 경우 이를 처리하기 위한 추가 규칙이 필요하다.

사용 예시

  • 엑셀이나 구글 스프레드시트에서의 데이터 내보내기 및 가져오기
  • 간단한 데이터베이스 간의 데이터 교환
  • 로그 데이터를 CSV 형식으로 저장 및 분석

 

 

ㅇXML(eXtensible Markup Language): 태그 기준

태그를 사용하여 데이터의 구조와 의미를 명확하게 정의할 수 있어 다양한 응용 분야에서 사용된다.

<?xml version="1.0" encoding="UTF-8"?>
<직원목록>
    <직원>
        <이름>홍길동</이름>
        <나이>30</나이>
        <직업>개발자</직업>
        <도시>서울</도시>
    </직원>
    <직원>
        <이름>김철수</이름>
        <나이>25</나이>
        <직업>디자이너</직업>
        <도시>부산</도시>
    </직원>
    <직원>
        <이름>이영희</이름>
        <나이>28</나이>
        <직업>마케터</직업>
        <도시>대구</도시>
    </직원>
</직원목록>

장점

  • 유연성: 사용자 정의 태그를 통해 다양한 데이터 구조를 표현할 수 있다.
  • 계층적 구조: 복잡한 데이터 관계를 계층적으로 표현할 수 있다.
  • 표준화: 다양한 표준과 프로토콜에서 널리 사용되어 상호 운용성이 높다.

단점

  • 무거움: 태그가 많아 파일 크기가 커질 수 있다.
  • 복잡성: 구조가 복잡해지면 파싱과 처리가 어려워질 수 있다.
  • 성능: 파싱 속도가 JSON 등에 비해 느릴 수 있다.

사용 예시

  • 웹 서비스의 데이터 교환 (예: SOAP)
  • 설정 파일 (예: Android의 manifest 파일)
  • 문서 표준 (예: XHTML, SVG)

 

 

(XML의 단점을 보완하기 위해 나온 경량의 데이터 교환 형식)

ㅇJSON(JavaScript Object Notation): 키-값의 딕셔너리 구조

인간이 읽고 쓰기 쉽고 기계가 쉽게 파싱하고 생성할 수 있다. 주로 웹 애플리케이션에서 클라이언트와 서버 간의 데이터 전송에 사용된다.

{
    "직원목록": [
        {
            "이름": "홍길동",
            "나이": 30,
            "직업": "개발자",
            "도시": "서울"
        },
        {
            "이름": "김철수",
            "나이": 25,
            "직업": "디자이너",
            "도시": "부산"
        },
        {
            "이름": "이영희",
            "나이": 28,
            "직업": "마케터",
            "도시": "대구"
        }
    ]
}

장점

  • 간결함: 불필요한 태그가 없어 파일 크기가 작다.
  • 가독성: 인간이 읽기 쉽도록 설계되었다.
  • 호환성: JavaScript와의 호환성이 뛰어나며, 대부분의 프로그래밍 언어에서 지원된다.
  • 빠른 파싱: JSON 파서는 경량화되어 있어 빠르게 처리할 수 있다.

단점

  • 데이터 타입 제한: XML에 비해 지원하는 데이터 타입이 제한적이다.
  • 보안 문제: JSONP 등의 사용 시 보안 취약점이 존재할 수 있다.
  • 표준 부족: 스키마 정의가 없기 때문에 데이터의 구조를 명확하게 정의하기 어렵다.

사용 예시

  • RESTful API의 데이터 교환
  • 설정 파일 (예: package.json)
  • 실시간 웹 애플리케이션의 데이터 통신

 

 

ㅇYAML(YAML Ain't Markup Language): JSON의 상위호환 버전 (즉, 일반적인 json 문서를 확장자만 바꾸어도 유효한 yaml문서이다)

사람이 읽기 쉬운 데이터 직렬화 형식으로, 주로 설정 파일이나 데이터 교환에 사용된다. 들여쓰기를 기반으로 한 구조를 가지며, 복잡한 데이터 구조도 간결하게 표현할 수 있다.

직원목록:
  - 이름: 홍길동
    나이: 30
    직업: 개발자
    도시: 서울
  - 이름: 김철수
    나이: 25
    직업: 디자이너
    도시: 부산
  - 이름: 이영희
    나이: 28
    직업: 마케터
    도시: 대구

장점

  • 가독성: 들여쓰기를 사용하여 구조를 명확하게 표현, 사람이 읽기 쉽다.
  • 유연성: 다양한 데이터 타입과 복잡한 구조를 지원한다.
  • 간결성: 불필요한 구문이 없어 간결하게 데이터를 표현할 수 있다.

단점

  • 공백 민감: 들여쓰기에 민감하여 실수하기 쉽다.
  • 파싱 복잡성: 구조가 유연해 파싱 구현이 복잡할 수 있다.
  • 보안 문제: YAML 파서는 실행 가능한 코드를 포함할 수 있어 보안 위험이 존재할 수 있다.

사용 예시

  • 애플리케이션의 설정 파일 (예: Docker Compose, Ansible)
  • 데이터 직렬화 (예: Kubernetes 설정 파일)
  • CI/CD 파이프라인 설정 (예: GitLab CI)

 

 

 

 

ㅁAJAX(Asynchronous JavaScript and XML): 비동기적으로 서버와 데이터를 주고받는 기술

AJAX는 웹 페이지를 새로고침하지 않고도 서버와 비동기적으로 데이터를 주고받을 수 있는 기술이다. 주로 사용자 경험을 향상시키기 위해 실시간 데이터 업데이트나 동적인 콘텐츠 로딩에 사용된다. e.g. 검색어 자동 완성

장점

  • 향상된 사용자 경험: 페이지 전체를 다시 로드하지 않고 필요한 부분만 업데이트하여 빠르고 부드러운 사용자 경험을 제공한다.
  • 효율성: 필요한 데이터만 전송하여 네트워크 사용을 최적화할 수 있다.
  • 유연성: 다양한 데이터 포맷(csv, xml, json, yaml 등)을 사용할 수 있어 상황에 맞게 선택할 수 있다.

단점

  • 복잡성: 비동기 처리와 상태 관리가 복잡해질 수 있다.
  • SEO 문제: 검색 엔진이 동적으로 로드된 콘텐츠를 제대로 인식하지 못할 수 있다.
  • 브라우저 호환성: 구형 브라우저에서는 제대로 지원되지 않을 수 있다.

사용 예시

  • 검색어 자동 완성 기능
  • 실시간 채팅 애플리케이션
  • 무한 스크롤 기능이 있는 웹사이트
  • 실시간 데이터 대시보드 e.g. 구글 맵에서의 확대/축소

AJAX와 데이터 포맷

AJAX는 다양한 데이터 포맷을 사용할 수 있어 유연한 데이터 교환이 가능하다. 예를 들어, 서버에서 JSON 형식의 데이터를 반환받아 클라이언트에서 이를 처리하거나, XML 데이터를 사용하여 구조화된 정보를 주고받을 수 있다. 또한, CSV나 YAML 같은 형식을 사용할 수도 있지만, JSON이 가장 일반적으로 사용되는 포맷이다.

 

 

 

데이터를 저장하고 전송하기 위한 다양한 포맷들이 각각의 장단점을 가지고 있다. CSV는 단순한 데이터 교환에 적합하고, XML은 구조적이고 계층적인 데이터를 표현하는 데 강점을 가진다. JSON은 경량화된 데이터 교환 포맷으로 웹 애플리케이션에서 널리 사용되며, YAML은 가독성이 높은 설정 파일에 적합하다. AJAX는 이러한 데이터 포맷들을 활용하여 사용자 경험을 향상시키는 기술로, 현대 웹 개발에서 필수적인 요소 중 하나이다.

프로젝트의 요구 사항과 데이터의 특성에 맞는 적절한 포맷을 선택하여 효율적이고 효과적인 데이터 관리를 구현하자.

 

(이 데이터 포맷들을 이용하기 위해 파싱하는 과정이 궁금하다면 아래 포스팅을 참고하자)

https://claremont.tistory.com/entry/%EB%8D%B0%EC%9D%B4%ED%84%B0-%ED%8C%8C%EC%8B%B1%EC%9D%B4%EB%9E%80feat-CSV-XML-JSON-YAML%EA%B3%BC-AJAX

 

데이터 파싱이란?(feat. CSV, XML, JSON, YAML과 AJAX)

https://claremont.tistory.com/entry/AJAX%EC%99%80-CSV-XML-JSON-YAML AJAX와 CSV, XML, JSON, YAML"데이터를 저장하고 전송하기 위한 포맷을" 알아볼 거다. 각각의 포맷은 데이터 표현 방식과 사용 목적에 따라 장단점이

claremont.tistory.com

 

 

 

 

 

 

참고 및 출처: https://namu.wiki/w/CSV, https://namu.wiki/w/XML, https://namu.wiki/w/JSON, https://namu.wiki/w/YAML, XML, JSON, YAML이 뭔가요?(얄팍한 코딩사전 유튜브) https://www.youtube.com/watch?v=55FrHTNjTCc

설명이 아주 잘 되어있다 :)