본문 바로가기
Flutter

[Flutter/플러터] Freezed 플러그인 사용하기 - (1)

by 얘리밍 2022. 9. 27.
320x100
728x90

 

Freezed란?

데이터 클래스에 필요한 편의 기능들을 Code Generation으로 제공하는 라이브러리

 

 

아래 공식문서를 살펴보자

 

 

 

 

freezed | Dart Package

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

pub.dev

 

 

 


 

 

 

사용 방법)

1.  pubspec.yaml 파일에 build_runner와 Freezed를 설치한다.

   -  터미널에서 설치

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


# 만약 fromJson 혹은 toJson으로 변환하는 기능을 사용하려면:
flutter pub add json_annotation
flutter pub add --dev json_serializable

 

 

 - 바로 설치

dependencies:
  freezed_annotation:

dev_dependencies:
  build_runner:
  freezed:
  json_serializable:

 

 

 

2. dart 파일에서 freezed 패키지 import

import 'package:freezed_annotation/freezed_annotation.dart';

 

 

 

 

3. freezed annotation과 만들고자 하는 클래스를 만든다

    아래는 공식 문서에 나와있는 예시 클래스 이다. 

//#1. freezed annotion 하기 

@freezed
class Person with _$Person {            //#2. 클래스 만들기
	const factory Person({
        required String firstName,     
        required String lastName,
        int? age,                       
     }) = _Person;
     
    //#3. fromJson 기능을 추가하고 싶을 때,
    factory Person.fromJson(Map<String, dynamic> json) => _$PersonFromJson(json);
    
}

 

 

Person 클래스 안에서 factory 생성자에 필요한 property를 작성한다

 

     항상 값을 받아오면 required를 꼭 붙여주어야 하며, 

     만약 null 값을 허용하는 변수라면 변수 형 옆에 ? 를 붙여주면 된다. 

 

 

 

 

아래 모델 형태를 보며 이해하면 더 쉽다

class Product {
    Product({
        required this.fisrtName,
        required this.lastName,
        required this.age,
    });

    String fisrtName;
    String lastName;
    int? age;
}

 

 

 

 

4. 아래 코드를 추가한 뒤, build_runner를 실행한다. 

part 'person.freezed.dart';
part 'person.g.dart';

json_serializabled 의 fromJson/toJson 기능을 사용하고 싶으면 두번째  part 'person.g.dart';  를 추가하거나

그렇지 않으면 위 코드만 넣으면 된다.

 

 

 

▶ build_runner를 통해 code generation 실행하기 

flutter pub run build_runner build

 

 

터미널에서 해당 코드를 실행하고 나면 다음과 같이 두개의 파일이 추가로 생성되는 것을 볼 수 있다.

(필자는 userLogin이라는 클래스를 만들었다..)

 

 

 

 

최종 코드 

import 'package:freezed_annotation/freezed_annotation.dart';


part 'person.freezed.dart';
part 'person.g.dart';


@freezed
class Person with _$Person {            
	const factory Person({
        required String firstName,     
        required String lastName,
        int? age,                       
     }) = _Person;
     
    factory Person.fromJson(Map<String, dynamic> json) => _$PersonFromJson(json);
    
}

 

 

추가 기능들에 대해서는 써보면서 다시 추가를 해 보겠다..

728x90
반응형