読者（私）

React は結構触ったことがある。Flutter はチュートリアルをこなしたぐらいで雰囲気程度の理解。最初は Flutter で Webアプリを作りたい。

flutter-architecture-blueprints とは

wasabeef さんが書いている Flutter の Blueprint。ざっくり以下の特徴を持つ。

• MVVM アーキテクチャ
• Riverpod による状態管理
• prd / dev 切り替え
• 各種ライブラリ対応（Dio, Firebase, FVM...）

https://github.com/wasabeef/flutter-architecture-blueprints

関連ドキュメント

https://speakerdeck.com/wasabeef/flutter-ready-for-production

https://wasabeef.medium.com/0-flutter-の設計を決める-4c6df9a77d67

https://wasabeef.medium.com/flutter-を-mvvm-で実装する-861c5dbcc565

MVVM とは

Model, View, View Model のアーキテクチャを表す。

• Model: データの保持
• ViewModel: View と Model を双方向に繋げるもの。イベントの管理も行う。
• View: ViewModel から渡されたデータを表示する。ユーザからの入力データも受け取る。

RiverPod

https://github.com/rrousselGit/river_pod
Provider パターンの上位互換。（個人的に）Provider パターンはネストの多いコンポーネント間でのバケツリレーを防ぐためのもの、という認識。RiverPod は Provider の上位互換で以下の課題を解決している。

• Providerで囲った配下のツリーからアクセスした時の ProviderNotFoundException を防ぐ手立てが「気をつけてコードを書く」しかない
• Widget ツリーの肥大化でデバッグし辛い
• 同じ型のものを複数同時に Provide できない

参考

• https://medium.com/flutter-jp/state-1daa7fd66b94

RiverPod の使い方

参考

• https://zenn.dev/umatoma/articles/2026ef43bdb0f4

FirebaseCrashAnalytics や、Dio がWebに対応しておらず中々動作しない。
初心に立ち返って、チュートリアルからやり直す。
https://zenn.dev/syunyo/scraps/826e9988c7e090