[Flutter] 상태 관리 앱 만들기 (라이브러리 사용)

 

📝 Flutter Riverpod 상태 관리 정리

Flutter에서 상태 관리를 쉽게 하기 위해 Riverpod을 활용할 수 있습니다.
Riverpod에는 여러 가지 Provider가 존재하며, 각각의 역할이 다릅니다.

이번 포스팅에서는 Provider, StateNotifierProvider, NotifierProvider의 차이점을 정리하고,
주석을 포함한 예제 코드와 함께 개념을 설명하겠습니다.

---

1️⃣ Provider (단순 데이터 제공)

✅ 개념

• Provider는 단순히 데이터를 제공하는 역할을 합니다.
• 상태 변경이 필요 없는 정적인 데이터를 관리할 때 사용됩니다.
• 한 번 데이터를 제공하면 더 이상 변경할 수 없습니다.

✅ 코드 예제

import 'package:flutter_riverpod/flutter_riverpod.dart';

class Todo {
  final bool isCompleted;
  final String description;

  Todo({required this.isCompleted, required this.description});
}

// 프로바이더 - 제공자
// 비유 : 창고관리자(1회 알바생) - 데이터 제공자
final todoProvider = Provider<Todo>(
  (ref) => Todo(isCompleted: true, description: '상태관리배우기'),
);

 

📌 특징

• ref.read(todoProvider) → 한 번만 데이터를 가져올 수 있음.
• UI에서 상태를 지속적으로 감지하지 않음.
• 상태가 변경되지 않기 때문에 정적인 데이터 관리에 적합.

---

2️⃣ StateNotifierProvider (상태 변경 가능)

✅ 개념

• StateNotifierProvider는 상태 변경이 가능한 창고 관리자 역할을 합니다.
• 상태(state)가 변경되면 이를 구독하고 있는 모든 위젯이 자동으로 업데이트됩니다.
• StateNotifier 클래스를 활용하여 상태 변경 기능을 추가할 수 있습니다.

✅ 코드 예제

import 'package:flutter_riverpod/flutter_riverpod.dart';

// 1. 창고 안에서 관리할 데이터 선정
String fruit = '사과';

// 2. 창고를 만들자 FruitStore(창고를 만들 때 규격이 있다 그 이름은 StateNotifier 이다.)
class FruitStore extends StateNotifier<String> {
  // super.state는 전달 받은 data를 상태로 등록시키는 과정이다(바코드 등록)
  FruitStore(super.state);

  // 창고 안에 데이터를 변경할 수 있는 기능을 만들어 주자
  void changeData(String data) {
    super.state = data;
  }
}

// 3. 창고 관리자에게 창고를 등록하고 관리하도록 설정
final fruitProvider = StateNotifierProvider<FruitStore, String>(
  (ref) => FruitStore(fruit),
);

 

📌 특징

• ref.watch(fruitProvider) → 상태 변경을 감지하여 UI가 자동 업데이트됨.
• ref.read(fruitProvider.notifier).changeData("딸기") → 상태 변경 가능.
• Riverpod 1.x 버전에서 사용되며, 상태 관리가 필요한 경우 유용함.

---

3️⃣ NotifierProvider (StateNotifier 개선 버전)

✅ 개념

• NotifierProvider는 StateNotifierProvider의 개선된 버전입니다.
• Riverpod 2.x 버전에서 도입되었으며, 더 간결한 코드로 상태를 관리할 수 있습니다.
• 기존 StateNotifier 대신 Notifier 클래스를 사용합니다.

✅ 코드 예제

import 'package:flutter_riverpod/flutter_riverpod.dart';

// 1. 창고에 넣을 데이터 선언
String myBook = '홍길동전';

// 2. 창고를 만들자 (규격 - Notifier)
class MyBookStore extends Notifier<String> {
  @override
  String build() {
    // 초기값을 설정
    return myBook;
  }

  // 창고안에 데이터를 변경하는 기능 추가
  void changeData(String book) {
    state = book;
  }
}

// 3. 창고 관리자에게 창고 등록하고 관리하도록 설정
final myBookStoreNotiProvider = NotifierProvider<MyBookStore, String>(
  () {
    return MyBookStore();
  },
);

 

📌 특징

• ref.watch(myBookStoreNotiProvider) → 상태 변경 감지 가능.
• ref.read(myBookStoreNotiProvider.notifier).changeData('데미안') → 상태 변경 가능.
• 기존 StateNotifierProvider보다 더 간결하게 상태 관리를 할 수 있음.
• Riverpod 2.x 버전에서 권장되는 방식.

---

📌 Provider 종류별 비교 정리

Provider 종류	상태 변경 가능 여부	상태 구독 (watch)	상태 변경 (read)	사용 예시
Provider	❌ 불가능	❌ (고정된 값)	✅ 한 번 가져오기	정적인 데이터
StateNotifierProvider	✅ 가능	✅ (상태 변화 감지)	✅ 창고 접근 가능	상태 관리 (1.x 버전)
NotifierProvider	✅ 가능	✅ (상태 변화 감지)	✅ 창고 접근 가능	상태 관리 (2.x 버전)

---

🔍 결론

• 정적인 데이터는 Provider를 사용하면 간단합니다.
• 상태를 변경할 필요가 있다면 StateNotifierProvider나 NotifierProvider를 사용하세요.
• Riverpod 2.x 버전에서는 NotifierProvider를 사용하면 더 간결한 코드 작성이 가능합니다.

상황에 따라 적절한 Provider를 선택하여, 깔끔하고 효율적인 상태 관리를 해보세요! 🚀

 

이전 단계가 궁금하다면?

[Flutter]상태 관리 앱 만들기 (nheritedWidget 사용)