Flutter : 상태 관리 (Provider 패턴) - 1

회사에서 Flutter를 사용하여 앱 개발을 시작하면서, 제일 처음 난관에 봉착했던 게 "상태 관리" 이다. 웹 개발을 하면서 딱히 상태 관리라는 걸 해 줄 일이 없었던 것 같은데 앱 개발에서는 필수라는 것을 알게 되었고, 관련 라이브러리가 많다는 것(provider, bloc, riverpod, getX 등)도 알게 되었다. 그 중에서 가장 접근하기 쉽고, 처음 입문하는 나 같은 사람에게 추천하는 Provider를 사용하기로 결정했다.

상태 관리란?

말 그대로 현재 데이터의 상태를 공유하는 것이다. 현재 데이터의 상태를 실시간으로 관찰하고, 갱신해 주거나 변경해 주고, 또 사용자 UI에 반영해 주는 것! 이다.

Provider 패턴은 왜 사용할까?

1. Provider를 사용하여 데이터가 관리되는 곳을 따로 분리하여 클래스들의 역할을 관심사에 따라 각각 나눌 수 있다.
2. 하나의 데이터로 여러 페이지에서 공유가 가능하다.
3. Bloc 패턴에 비해 조금 더 간결한 코드로 표현이 가능하다.

Provider 패키지 install

https://pub.dev/packages/provider
pub.dev 에서 provider를 검색하고,
프로젝트 경로로 들어가 패키지를 설치해 준다.

flutter pub add provider

설치가 끝나면 pubspec.yaml 에 dependencies : provider 가 추가된다.

추가가 완료되었다면, import 하여 프로바이더를 사용하면 된다!

import 'package:provider/provider.dart';

Provider 사용하기 - 예제

class Count extends ChangeNotifier {
	
    int count = 0;
		
	increaseCount(){
    	
        count++;
        
        notifyListeners();
    	
    }
}

increaseCount 함수를 호출하면 count를 하나씩 증가시켜주는 기본형의 예제이다. 천천히 살펴보자!

1. provider 패턴을 사용하기 위해서는 관리하고자 하는 클래스가 ChangeNotifier 를 상속받아야 하는데, 이는 해당 위젯을 상태 관리가 가능하도록 만들어 주는 클래스이다. 말 그대로 상태 변화를 알려주는 클래스가 되는 것이다!
2. notifyListeners(); 는 하위의 구독자들, 즉 해당 데이터를 사용하고 있는 리스너 위젯들에게 상태가 변화되었음을 전달해 주는 알림 메서드이다. 이 notifyListeners() 함수는 ChangeNotifier 를 상속 받아야만 사용이 가능하다.

정리해 보자면, increaseCount() 함수가 호출되면 count가 1 증가하고, 해당 count 클래스의 데이터를 구독하고 있던 위젯들에게 notifyListeners() 함수가 count 값이 변화되었음을 알려준다.