[강의자료] Json 무엇이고 Dart 에서 어떻게 사용할까?

JSON

JSON(JavaScript Object Notation) 은 데이터를 구조화해서 저장하고 전달히기 위한 텍스트 기반의 데이터 포맷입니다. 즉, 데이터를 구조화해서 특정 형태의 형식으로 전달합니다.

사람이 읽고 쓰기 쉽고, 

 

구조화의 예는 다음과 같습니다.

{
  "name": "HealthyRyu",
  "age": 30,
  "isAlive": true
}

 

구조화를 했다는것은 정보가 어떤 의미를 가지는지 명확하게 정해져있고, key-value 형태로 정리되어 있는것을 의미합니다.

 

특징

- 경략 텍스트 포맷

- 다양한 언어에서 지원 (Dart, Kotlin, JavaScript, Python 등)

- 데이터 구조가 key-value 형태로 표현

- String, int, double, boolean, Null, List 데이터 전달 가능

 

Dart 에서 JSON 이 사용되는 방법

Dart, Flutter 에서는 주로 네트워크 통신(REST API), 로컬 저장, 파일 입출력 등에서 활발하게 사용됩니다. Dart 에서는 기본 제공되는 dart:convert 패키지의 jsonDecode()을 활용해서 JSON 문자열을 역직렬화해서 사용 가능한 객체, Map, List 등으로 데이터를 가공해서 사용합니다. 혹은 반대로 jsonEncode()을 활용해서 객체, Map, List 등의 데이터를 직렬화(전송,저장 가능한 형태)해서 데이터를 전송하거나 저장할 수 있습니다.

 

- 직렬화 : 객체, Map, List 등의 데이터를 저장하거나 전송할 수 있는 데이터 형태를 변환

- 역직렬화 : 저장,전송 가능한 데이터를 프로그래밍 가능한 객체, Map, List 등의 데이터로 형태를 변환

 

 

예제 따라하기

간단한 JSON 데이터 Dart 에서 사용할 수 있게 만들어봅시다. 간단하게 다음과 같은 데이터가 제공된다고 가정을 하고, JSON 문자열을 Dart 에서 사용할 수 있게 파싱을 해서 변환해보도록 하겠습니다.

 

JSON 데이터

{
  "name": "HealthyRyu",
  "age": 30,
  "isAlive": true
}

 

Dart

import 'dart:convert';

String jsonStr = '... 위의 JSON 데이터 ...';

Map<String, dynamic> map = jsonDecode(jsonStr);

print(map['name'])

 

위와 같이 print 문을 하게되면 HealthyRyu 가 출력되게 됩니다. 기본적으로 Dart 에서 사용할 수 있게 파싱 작업을 해서 데이터를 사용할 수 있게 했습니다.

 

여기서 jsonDecode() 는 Dart 에서 제공하는 JSON 문자열을 Map 또는 List 데이터로 변환시켜주는 함수입니다.

String jsonStr = '{"name": "Jason", "age": 30}';
Map<String, dynamic> user = jsonDecode(jsonStr);
print(user['name']); // Jason
print(user['age']);  // 30


String jsonStr = '[{"id":1,"title":"hello"},{"id":2,"title":"world"}]';
List<dynamic> items = jsonDecode(jsonStr);
print(items[0]['title']); // hello

 

예제 따라하기 레벨업

여기서 한 단계 더 나아가서 데이터를 구조화해서 사용하는 방법을 알려드리도록 하겠습니다. 프로젝트가 조금씩 커질수록 안정성, 가독성, 유지보수 측면에서 모델 클래스를 만들어서 데이터를 구조화 하는게 유리합니다.

 

JSON 데이터가 name, age, isAlive 라는 형태의 데이터가 전송되었으면 해당 key 요소들을 기반으로 클래스를 만들면 됩니다. name(이름), age(나이), isAlive(살아있음?) 데이터를 받았다고 하면 기본적으로 떠오르는 집합체의 단어는 Person, User 정도입니다. 그래서 해당 이름으로 클래스를 만들어서 구조화 해주면 됩니다.

 

Dart

class Pserson {
  String name;
  int age;
  bool isAlive;
  
  Person(this.name, this.age, this.isAlive);
  
  factory Person.fromJson(Map<String, dynamic> json) {
    return Person(
      json['name'],
      json['age'].
      json['isAlive']
    );
  }
}

 

Dart

import 'dart:convert';

String jsonStr = '... 위의 JSON 데이터 ...';

Person person = Person.fromJson(jsonDecode(jsonStr));

print(person.name);

 

위와 같은 코드를 구성하면 출력값은 역시나 HealthyRyu 가 나옵니다. JSON 문자열을 Person.fromJson() 을 이용해서 Person 객체를 만들어서 name 이라는 데이터에 접근해서 사용하면 됩니다.