Flutter로 개발된 여러 프로젝트 중 우리가 공부를 위해 접하는 대부분의 프로젝트는 하나의 Flutter프로젝트로 구성된 경우가 많다.
단일 프로젝트로 구성할 경우, 개발이 편리하다는 이점이 있지만, 프로젝트가 거대해질 경우, 하나의 프로젝트에 너무 많은 종속성과 기능들이 구현되어 복잡해질 수 있다.
이를 해결하기 위해 멀티모듈이라는 방식이 있는데, 이번 글에서는 멀티모듈을 Flutter에서 구현하는 예제를 소개하고자 한다.
메인 프로젝트 생성
우선, 메인 프로젝트가 될 프로젝트를 생성한다. 일반적으로 Flutter프로젝트를 생성할 때 사용하는 명령어를 사용하면 된다.
flutter create <project_name>서브 프로젝트 생성
메인 프로젝트가 생성되면 각 기능을 담당할 서브 프로젝트를 생성하면 된다. 서브 프로젝트를 생성할 때는 해당 서브 프로젝트를 메인프로젝트의 하위로 둘지, 아니면 별개의 경로에 별도로 구성할 지 선택해야한다.
만약 메인 프로젝트의 하위에 둘 경우, 메인 프로젝트를 깃으로 관리하면 서브프로젝트도 자연스럽게 깃에 관리되어 관리가 편하다는 장점이 있다. 하지만
이 때, 기능을 분리하는 기준은 여러가지가 있을 수 있지만, 나의 경우는 아래와 같은 방식으로 기능을 분리한다.
.
└── root/
└── lib/
├── route/
│ └── route.dart
├── modules/
│ ├── design_system/
│ │ └── lib/
│ │ └── design_system.dart
│ ├── core/
│ │ └── lib/
│ │ └── core.dart
│ ├── domain/
│ │ └── lib/
│ │ └── domain.dart
│ ├── common/
│ │ └── lib/
│ │ └── common.dart
│ ├── feature_a/
│ │ └── lib/
│ │ └── feature_a.dart
│ ├── feature_b/
│ │ └── lib/
│ │ └── feature_b.dart
│ └── ...
└── main.dart각각의 서브 프로젝트는 다음과 같은 기능을 담당한다.
-
design_system- 여러 모듈이 공통적으로 사용하는 UI
- TextStyle, Color, Theme
-
core- 여러 모듈이 공통적으로 사용하는 중요 로직(static 함수, Singleton, ViewModel 등등)
-
domain- 모든 API, Repository, Data Model 등에 대한 정의
-
common- 모든 상수 값(constants, Enum 등)에 대한 정의
-
feature- 하나의 기능을 담당하는 모듈
이 구조는 하나의 예시일 뿐이고 더 좋은 구조가 있다면 얼마든지 변경해 사용할 수 있다. 이제, 각각의 프로젝트마다 필요한 모듈을 pubspec.yaml에 추가해 사용해주면 된다.
장점
그래서, 이렇게 멀티모듈로 프로젝트를 구성할 경우 얻을 수 있는 장점이 무엇일까?
단순히 멀티모듈 그 자체만 보면, 단일 프로젝트에 비해 구조도 복잡하고, 각각의 모듈에 변경사항이 발생하면, 어떤 경우는 flutter pub get을 해줘야 할 때도 있다.
그럼에도 불구하고, 멀티 모듈을 사용하는 이유는 바로,
재사용성
때문이다.
예를 들어, 우리가 하나의 브랜드로 여러 서비스를 만들 때, UI라던가, 기능적으로 일관성을 가져가야 하는 경우가 있다.
이 경우, 단일 프로젝트로 구성된 서비스는 기능을 분리하기가 어려워 차라리 동일한 기능을 신규 서비스에 새로 개발하는 것이 나을 수도 있는 경우가 있지만, 여러 프로젝트로 구성된 멀티 모듈의 경우 필요한 기능이나 디자인을 가진 모듈을 그대로 가져다 사용할 수 있다.
