全体のまとめ - 1m-llc/Flutter-KtoK GitHub Wiki

学習方法

以下の順番が良さそう

1. 環境構築
2. コーディングスタイル理解
3. Dart学習
4. Flutter学習
5. 状態管理学習

デザイン

マテリアル・クパチーノで２パターン作るか判断が必要
マテリアルデザインに寄せるなら、開発側とのギャップを抑えられるようデザイナーに「Flutter Gallery」を予め確認して欲しい。

アーキテクチャ

CleanArchitecture + MVVM

DeNAでは、Clean Architecture+Bloc を採用 https://engineer.dena.com/posts/2020.03/techcon-app-2020-made-with-flutter-architecture/

状態管理

Provider+ChangeNotifier

CI/CD

Bitrise

テスト

Flutter公式サイトに単体、ウィジェット、結合テストの方法が良さそう

永続化

sharedpreferences
(+moor)

通信

http（Flutter公式）

フォルダ構成

Clean Architecture

/
 ∟ data ← 永続化を定義
   ∟ firebase_repositories ← Firestoreと通信
   ∟ moor_repositories ← moorと通信
   ∟ spres_repositories ← SharedPreferencesと通信
     ∟ enum ← SharedPreferencesのkey定数
   ∟ stub_repositories ← テスト用ダミーと通信

 ∟ domain ← ビジネスロジックを定義
   ∟ entities ← ストレージに保存するエンティティ
   ∟ providers ← 状態管理
   ∟ repositories ← データ層のリポジトリを利用
   ∟ usecases ← アプリケーションのビジネスロジック

 ∟ presentation ← UIを定義
   ∟ constants ← 定数を定義
   ∟ navigations ← 画面遷移を定義
   ∟ utils ← ユーティリティーを定義
   ∟ viewmodel ← UIのロジック＆UseCaseから流れてくるDataとViewのバインディングを定義
   ∟ views ← ウィジェットを定義

 ∟ main.dart


/assets ← 素材
 ∟ fonts ← フォント
 ∟ icons ← アイコン
 ∟ images ← 画像


/test ← テストコード
 ∟ repositories ← 通信テスト
 ∟ usecases ← アプリケーションロジックテスト
 ∟ viewmodels ← UIロジックテスト
 ∟ widgets ← ウィジェットテスト

/pubspec.yaml ← アプリケーション定義

/flutter_native_splash.yaml ← スプラッシュ画面定義