[flutter] 플러터에서의 bloc 패턴으로 스마트 건강 관리 앱 개발하기

20 Dec 2023

flutter

소개

이번 프로젝트에서는 플러터(Flutter) 프레임워크를 사용하여 스마트 건강 관리 앱을 개발할 것입니다. 이 앱은 사용자의 건강 정보를 관리하고, 신체 활동과 식단을 추적하여 개인 맞춤형 건강 가이드를 제공할 것입니다. 우리는 앱의 상태 관리 및 비즈니스 로직을 처리하기 위해 Bloc(Business Logic Component) 패턴을 사용할 것입니다.

Bloc 패턴 소개

Bloc 패턴은 앱의 데이터 흐름과 상태 관리를 위한 솔루션으로, Flutter 앱의 복잡성을 관리하는 데 효율적입니다. Bloc 패턴은 뷰(View)와 비즈니스 로직을 분리하여 유지보수성을 향상시키고, 앱의 상태 변화를 예측 가능하게 만듭니다.

Bloc 라이브러리 설치

먼저, bloc 패키지와 flutter_bloc 패키지를 앱에 추가해야 합니다. 이를 위해 pubspec.yaml 파일에 다음과 같이 의존성을 추가합니다:

dependencies:
  flutter:
    sdk: flutter
  bloc: ^8.0.0
  flutter_bloc: ^8.0.0

의존성을 추가한 후, 터미널에서 flutter pub get 명령어를 실행하여 패키지를 설치합니다.

Bloc 이벤트, 상태, 로직 정의

앱의 Bloc로직을 정의하기 위해, 먼저 이벤트(Events)와 상태(States)를 정의해야 합니다. 예를 들어, 사용자가 측정한 혈압을 업데이트하는 이벤트나, 현재 건강 상태를 나타내는 상태를 정의할 수 있습니다.

abstract class HealthEvent {}

class UpdateBloodPressure extends HealthEvent {
  final int systolic;
  final int diastolic;

  UpdateBloodPressure(this.systolic, this.diastolic);
  // ...
}

abstract class HealthState {}

class HealthLoading extends HealthState {
  // ...
}

class HealthDataLoaded extends HealthState {
  final HealthData healthData;

  HealthDataLoaded(this.healthData);
  // ...
}

Bloc 클래스를 만들고 Bloc로직을 정의하여, 각 이벤트에 대한 상태 변화를 관리할 수 있습니다.

class HealthBloc extends Bloc<HealthEvent, HealthState> {
  final HealthRepository repository;

  HealthBloc(this.repository) : super(HealthLoading());

  @override
  Stream<HealthState> mapEventToState(HealthEvent event) async* {
    if (event is UpdateBloodPressure) {
      // 혈압 업데이트 로직
      // ...
      yield HealthDataLoaded(updatedHealthData);
    }
    // ...
  }
}

Bloc 위젯 통합

Bloc 패턴을 적용하기 위해, BlocProvider와 BlocBuilder 위젯을 사용하여 Bloc로직을 위젯과 통합합니다. BlocProvider 위젯을 통해 Bloc 인스턴스를 제공하고, BlocBuilder 위젯을 통해 Bloc의 상태 변화에 따라 화면을 갱신합니다.

BlocProvider(
  create: (context) => HealthBloc(healthRepository),
  child: BlocBuilder<HealthBloc, HealthState>(
    builder: (context, state) {
      if (state is HealthLoading) {
        return CircularProgressIndicator();
      } else if (state is HealthDataLoaded) {
        return HealthDataView(state.healthData);
      }
      // ...
    },
  ),
)

결론

위에서 소개한 대로, Bloc 패턴을 사용하여 플러터 앱에서 스마트 건강 관리 앱을 개발할 수 있습니다. Bloc 패턴을 통해 앱의 상태 관리와 비즈니스 로직을 효율적으로 처리하고, 앱의 유지보수성과 확장성을 향상시킬 수 있습니다. Bloc 패턴을 활용하여 개발한 스마트 건강 관리 앱을 통해 사용자들이 더 나은 건강 상태를 유지할 수 있기를 기대합니다.

참고