[Flutter] 프로젝트 초기 설정 - 폴더 구조

새 프로젝트 개발에 들어가기에 앞서 폴더 구조에 대한 고민을 해보았다.

보통 플러터로 개발할 때 많이 쓰이는 폴더 구조는 다음과 같다:

1. Type/Domain 으로 폴더를 구분하는 구조

• 이런 식으로 lib 폴더 안에 models, screens, widgets, services 등의 폴더를 두어 용도에 맞게 관리한다.

• 이 구조는 폴더별로 특정한 역할을 수행하는 코드가 모여있기 때문에, 코드를 모듈화하고 관리하여 유지보수하기 쉽다는 장점이 있다. 하지만, 큰 규모의 애플리케이션에서는 이보다 더 세분화된 폴더 구조가 필요하다.

    lib/               
    ├── models/         # 데이터의 모델 클래스들 보관
    ├── screens/        # 애플리케이션 화면들
    ├── widgets/        # 재사용 가능한 위젯들 
    ├── services/       # 백엔드 서비스와 통신 관련 코드
    ├── utils/          # 유틸리티 함수들
    ├── themes/         # 애플리케이션 테마와 스타일 관련 코드
    ├── routes.dart     # 내비게이션 루트 설정
    └── main.dart
  

2. Feature 별로 폴더를 따로 두는 구조. '기능별 그룹화'

• 이런 식으로 기능마다 폴더를 그룹화하여 관리한다.

• 각 기능은 모듈화된 단위로 분리되어 있어서 코드 관리와 협업이 용이하고, 새 기능이 추가되거나 기존 기능이 빠졌을 때 수정하기도 좋다.

    lib/
    ├── feature_1/
    │   ├── screens/
    │   ├── models/
    │   ├── services/
    │   └── ...
    ├── feature_2/
    │   ├── screens/
    │   ├── widgets/
    │   └── ...
    ├── feature_3/
    │   ├── screens/
    │   ├── widgets/
    │   ├── models/
    │   ├── services/
    │   ├── view_models/
    │   └── ...
    ├── utils/
    ├── themes/
    ├── main.dart
    └── ...
  

이외에도, MVVM 이나 클린 아키텍처를 적용한 폴더 구조가 있는데, 각각의 장단점이 있으니 프로젝트별로 다각도로 고려하여 적절한 아키텍처를 골라야 한다.

내가 이번에 진행하는 프로젝트는 다음과 같은 특징이 있기에, '기능별 그룹화' + MVVM 이 결합된 폴더 구조를 선택하기로 결정했다.

• Riverpod 라이브러리를 사용해 상태 관리를 수행 예정

  • viewmodels 폴더에 Riverpod providers를 담아서 상태 관리를 일관되게 유지할 수 있음

• 과 동기들과 진행하는 크진 않은 프로젝트라 간결하고 모듈화가 쉬운 구조 필요

• 협업시 서로 독립적으로 작업할 수 있는 환경이 필요하고, 서브 프론트(?) 로서 기여하는 팀원을 위한 코드 가이드라인이 있으면 좋음

• 같은 기능 안에서도 뷰와 비즈니스 로직을 각각 다른 사람이 개발할 가능성이 있어서, 뷰와 로직의 분리가 필요

• 프로젝트 특성 상 갑자기 기능이 추가되거나 빠질 수 있어서 확장성 좋은 구조 필요

기능별 그룹화 + MVVM이 결합된 폴더 구조의 예시는 다음과 같다
(사실 이건 gpt 시켜서 뽑았다)

---

이외에도 프로젝트를 진행하며 라우팅, 상태관리 라이브러리 등을 정리할 예정이다. 이렇게 공개적으로 적어두면 미래의 내가 언젠간 하겠지?

처음에 공부하거나 인턴을 했을 땐 그냥 강의에서 하라는대로 하거나 위에서 정해준 프로젝트 구조에 따르기만 했는데, 이렇게 처음부터 프론트엔드 리드(?) 로서 프로젝트에 참여하게 되니 사소한 거 하나하나 신경쓸 게 정말 많다는걸 체감할 수 있었다.

이번 프로젝트의 과정 속에서 얻어가는게 많으면 좋겠는 마음이다~!