아키텍처 🏗️

기본 구조

MVI + MVVM, Clean Architecture 패턴을 사용합니다.

디렉토리 구조

lib/
├── core/
│   ├── routing/
│   ├── ui/
│   │   ├── component/
│   │   │   └── input_field.dart
│   │   └── style/
│   │       ├── app_colors.dart
│   │       └── app_text_styles.dart
│   └── util/
│       ├── string_helper.dart
│       └── ...
├── auth/
│   └── login/
│       ├── data/
│       │   ├── data_source/
│       │   ├── data_source_impl/
│       │   ├── repository_impl/
│       │   ├── mapper/
│       │   └── dto/
│       ├── domain/
│       │   ├── model/
│       │   ├── repository/
│       │   └── usecase/
│       └── presentation/
│           ├── login_action.dart
│           ├── login_event.dart
│           ├── login_screen.dart
│           ├── login_screen_root.dart
│           ├── login_state.dart
│           └── login_view_model.dart

레이어별 역할

• data: 외부 데이터 소스와의 통신, DTO 관리
• domain: 비즈니스 로직, 모델, 저장소 인터페이스, 유스케이스
• presentation: UI 컴포넌트, 상태 관리, 사용자 액션 처리

MVI 패턴 📐

개요

MVI(Model-View-Intent) 패턴은 단방향 데이터 흐름을 통해 예측 가능한 상태 관리를 제공합니다.

구성 요소

Model

• 앱의 데이터와 비즈니스 로직을 포함
• 우리 앱에서는 State 클래스가 이 역할 담당

View

• UI를 렌더링하고 사용자 입력을 캡처
• [기능명]_screen.dart 파일이 담당

Intent

• 사용자 의도를 나타내는 액션
• [기능명]_action.dart에 정의

데이터 흐름

User Action → Action → ViewModel → State 변경 → UI 업데이트 → User Action...

장점

• 예측 가능한 상태 관리
• 디버깅 용이성
• 단방향 데이터 흐름으로 사이드 이펙트 최소화
• 테스트 용이성