모바일 개발하는 자바리안의 메모장

Flutter - Freezed 을 이용한 Model 관리 본문

Flutter

Flutter - Freezed 을 이용한 Model 관리

자바리안 2022. 11. 16. 23:33
반응형

https://pub.dev/packages/freezed

 

freezed | Dart Package

Code generation for immutable classes that has a simple syntax/API without compromising on the features.

pub.dev

 

Freezed 패키지는 모델을 보다 효율적으로 관리하고 사용할 수 있게 도와주는 Package다.

Riverpod을 개발한 팀에서 개발했기 때문에 Provider와 같이 쓰면 더 빛을 발한다고 한다.

 

Freezed pub.dev에 들어가보면 개발자들이 dart에서 모델을 정의하는 일은 매우 지루한 일이라고 설명하며 아래와 같은 기능들을 직접 구현해야하는 게 불편하다고 설명했다 :

  • Constructor
  • Properties
  • toString()
  • == operator
  • copyWith()
  • Serialization

 

JsonSerializable을 통해 직렬화 코드를 직접 작성하는 고생을 덜 수는 있었지만,  그 외에도 복제, 비교, 복제 등 다양한 기능들을 제공해준다.

 

자 그럼 설치부터 해보자. 추가해줘야 할 것들이 많다. Flutter 프로젝트의 경우 아래 페키지들을 순서대로 설치해주자 :

flutter pub add freezed_annotation
flutter pub add --dev build_runner
flutter pub add --dev freezed
flutter pub add json_annotation
flutter pub add --dev json_serializable

 

준비가 끝났으니 간단한 freezed model 을 만들어보자.

우선 코드는 아래와 같다 :

import 'package:freezed_annotation/freezed_annotation.dart';

part 'person_model.freezed.dart';
part 'person_model.g.dart';

@freezed
class Person with _$Person {
  const factory Person({required String? name, required int? age}) = _Person;

  // not mandatory
  factory Person.fromJson(Map<String, dynamic> json) => _$PersonFromJson(json);
}

 

Freezed 모델은 build runner를 실행하기 전에 미리 선언해둬야 할 부분들이 있다 :

  1. 클레스명 상단에 @freezed annotation
  2. Part 추가 => part '[모델 파일명].freezed.dart' (json 직렬화 추가할 경우 '[모델 파일명].g.dart'도 추가)
  3. '_$[클래스명]' 이름의 mixin 참조
  4. 팩토리 생성자

 

당연히 이렇게 코드를 추가하면 빨간줄이 쫙쫙 뜬다. 당연한거니 놀라거나 뒤로가기를 누르지 않길 바란다.

위 코드는 사전정의를 한 거라고 생각하면 된다. part가 되는 파일과 미리 정의해 둔 mixin, class는 다음 명령어를 실행하여 생성해주자 :

flutter pub run build_runner build

문제 없이 build가 끝났다면 model에 part로 추가했던 파일들이 아래와 같이 생성된 것을 확인할 수 있다 :

Freezed.dart에 freezed model이 제공해주는 모든 기능들에 코드가 담겨있다. build_runner가 @freezed가 붙은 모델에 freezed가 정의해 둔 도우미 코드를 제공해줬다고 생각하면 된다.(자세한 내용은 추후 build_runner 다룰 때 다시..)

 

자 그럼 freezed에서 제공해주는 몇몇 기능들을 간단하게 테스트해보자 : 

  var person1 = Person(name: 'KM', age: 30);
  var person2 = Person(name: 'KM', age: 30);

  debugPrint('${person1 == person2}'); // returns true

== 는 참조값이 아닌 property의 값들을 비교해주는 걸 확인할 수 있다.

참고로 해당 operator는 immutable model, 즉 freezed로 선언된 모델에서만 사용할 수 있으며 unfreezed가 붙은 mutable 모델에서는 사용할 수 없다고 한다.

 

그 다음으로는 copyWith()를 살펴보자 :

  var person1 = Person(name: 'KM', age: 30);
  var person2 = person1.copyWith(age: 32);

쉽게 객체를 복제하며 동시에 원하는 property 정보만 바꾸는 것도 가능하다.

 

마지막으로 freezed model를 print해보자 :

  var person1 = Person(name: 'KM', age: 30);
  debugPrint('$person1');

Freezed에서 override해준 toString()덕에 쉽게 모델의 정보를 확인할 수 있다.

 

이 외에도 다양한 기능들과 알면 좋은 정보들이 있으니, pub.dev에 가서 전체적인 내용을 한번 읽어보는 것을 추천한다.

 

반응형
Comments