플러터로 앱 만들기 플러터로 앱 만들기

기본 개념각 기능의 UI계층은 View + ViewModel로 구성됨ViewModel: UI 상태 관리, 로직 처리View: UI 상태를 표시, ViewModel과 1:1 관계예: LogOutView, LogOutViewModel ViewModel 역할ViewModel은 UI 로직을 처리하는 역할 클래스도메인 모델 데이터를 입력받아 View가 사용할 수 있도록 UI 상태로 변환버튼 클릭 등의 이벤트 처리 로직 포함이벤트를 데이터 계층으로 전달하여 변화 유도 다음 코드는 HomeViewModel이다. 이 뷰모델은 데이터를 제공받기 위해 BookingRepository와 UserRepository에 의존한다.// home_viewmodel.dartclass HomeViewModel { HomeViewMod..

이제부터 플로터에 아키텍처를 적용해서 만든 예제 코드를 작성해 보자. Compass 앱이란?여행 일정을 만들고 예약할 수 있는 샘플 앱HTTP 서버 통신, 개발/운영 환경, 브랜드 스타일, 높은 테스트 커버리지 등 실제 앱처럼 구성됨MVVM 패턴 적용 이 사례에서 배우는 것들:MVVM 구조에서 repository와 service 사용법Command 패턴으로 안전하게 UI 업데이트하기ChangeNotifier / Listenable을 통한 상태 관리provider 패키지로 의존성 주입(DI) 구현테스트를 설정하는 방법대규모 플러터 앱에 적합한 효과적인 패키지 구조 패키지 구조구조 목적여러 개발자가 함께 작업할 때 충돌 최소화, 이해도 향상잘 정의된 아키텍처와 맞물려 코드 품질 향상 코드 구성 방식기능별 구..

목적이 가이드는 확장성, 유지보수성, 테스트 용이성을 높이기 위한 Flutter 앱 아키텍처의 모범 사례를 소개함.규칙이 아닌 가이드라인이므로, 필요에 따라 유연하게 적용해야 함. 프로젝트 구조 개요Flutter 앱은 크게 두 개의 계층으로 구성된다:UI 계층: 화면 구성 및 사용자 입력 처리데이터 계층: 데이터 처리 및 저장( 로직 계층은 선택사항으로 복잡한 앱에서 추가할 수 있음. 뒤에서 자세히 설명되어 있음 ) 계층 구성 요소각 계층은 다음과 같은 구성 요소로 나뉘어 관리된다:View: 실제 UI 화면ViewModel: UI 로직 담당Repository: 데이터의 단일 진실 공급원 (SSOT)Service: 외부 API나 플랫폼과의 연동 담당 MVVM 패턴 적용MVVM은 앱 기능을 세 부분으로 분..

아키텍처란?소프트웨어 시스템의 구조와 설계 원칙을 의미함소프트웨어를 어떻게 구성하고, 각 구성 요소가 어떻게 상호작용할지에 대한 큰 그림 아키텍처의 구성 요소계층 구조컴포넌트 간의 책임 분리 (예: 컨트롤러는 요청 처리, 모델은 데이터 처리)데이트 흐름 (어디서 데이터가 생성되고, 어떻게 전달되는지)모듈 간의 관계 및 의존성설계 원칙 (예: SOLID 원칙, 의존성 역전 등)왜 사용하는가?유지보수 용이성 : 기능 추가 / 변경 / 수정이 수워짐재사용성 증가 : 잘 나눈 모듈은 다른 프로젝트에서도 재사용할 수 있음협업 효율 증가 : 역할이 명확해서 여러 명이 동시에 작업해도 충돌이 적음테스트 용이성 : 각 구성 요소를 개별적으로 테스트하기 쉬움확장성 확보 : 서비스 규모가 커져도 구조적으로 잘 대응할 수 ..

Flutter에서 불변 데이터 모델 만들기Flutter 앱에서는 사용자 정보, 게시글, 제품 정보 등 다양한 데이터 모델을 다루게 됩니다. 이 모델들을 안전하게 관리하려면, "불변(immutable)" 객체로 만드는 것이 좋습니다.직접 만들 수도 있지만 실수가 생기기 쉬워요. 그래서 Dart에서는 자동으로 코드를 생성해 주는 도구를 사용하는 것이 좋습니다. 대표적인 도구는 다음 두 가지입니다:freezed: 가장 널리 쓰이는 방법built_value: Google에서 만든 강력한 타입 시스템freezed를 사용한 데이터 모델장점설정이 간단하고 사용법이 직관적copyWith, ==, hashCode, JSON 변환 등을 자동으로 생성코드가 깔끔하고 현대적 스타일예제: User 모델pubspec.yamlde..

Dart는 예외를 throw 하고 catch 할 수 있는 내장된 오류 처리 메커니즘을 제공합니다. Dart의 예외는 언체크 예외(unhandled exceptions) 입니다. 이는 예외를 throw 하는 메서드가 이를 명시할 필요가 없고, 호출하는 메서드도 이를 반드시 catch 하지 않아도 된다는 의미입니다. 이로 인해 예외가 제대로 처리되지 않는 상황이 발생할 수 있습니다. 대규모 프로젝트에서는 개발자가 예외를 잡는 것을 잊어버릴 수 있고, 애플리케이션의 다양한 계층 및 컴포넌트에서 던져지는 예외들이 문서화되지 않을 수 있습니다. 이는 오류 및 앱 크래시로 이어질 수 있습니다. 이 가이드에서는 이러한 제한점과 이를 Result 패턴을 사용해 완화하는 방법을 소개합니다.Flutter 애플리케이션에..

Model-View-ViewModel (MVVM)은 애플리케이션의 기능을 세 부분으로 분리하는 디자인 패턴입니다. 뷰(View)와 뷰모델(ViewModel)은 애플리케이션의 UI 계층을 구성하며, 리포지토리(Repositories)와 서비스(Services)는 데이터 계층, 즉 MVVM의 모델 계층을 나타냅니다. 커맨드(Command)는 메서드를 감싸는 클래스이며, 이 메서드가 실행 중인지, 완료되었는지, 오류가 발생했는지 등 다양한 상태를 관리하는 데 도움을 줍니다. 뷰모델은 커맨드를 사용하여 상호작용을 처리하고 동작을 실행할 수 있습니다. 또한, 커맨드는 실행 중인 작업을 나타내는 로딩 인디케이터나 오류 발생 시 에러 다이얼로그와 같은 UI 상태를 표시하는 데 사용될 수 있습니다. 애플리케이션이 커지..

Offline-first 애플리케이션은 인터넷에 연결되지 않은 상태에서도 대부분 또는 모든 기능을 제공할 수 있는 앱입니다. Offline-first 애플리케이션은 일반적으로 저장된 데이터를 활용하여, 원래는 온라인에서만 접근 가능한 데이터에 임시로 접근할 수 있도록 사용자에게 제공합니다. 일부 offline-first 애플리케이션은 로컬 데이터와 원격 데이터를 매끄럽게 결합하여 제공하는 반면, 다른 애플리케이션은 캐시 된 데이터를 사용하는 중임을 사용자에게 알립니다. 마찬가지로, 일부 애플리케이션은 데이터를 백그라운드에서 자동으로 동기화하는 반면, 다른 애플리케이션은 사용자가 명시적으로 동기화를 수행해야 합니다. 이는 모두 애플리케이션의 요구사항과 제공하는 기능에 따라 달라지며, 어떤 구현이 적합한지는..