![見出し画像](https://assets.st-note.com/production/uploads/images/33994107/rectangle_large_type_2_22a912282da951e2cd6811fc8a61bea1.jpg?width=1200)
Riverpod による実用的なアーキテクチャを Todo リストを例に考えてみる | Flutter
この記事は古くなっています。新しい内容は こちら になります(https://note.com/mxiskw/n/n78a69ca171cb)。
以前のバージョンをすでに購入されている方は、
2021年度中に Emailアドレスに添えて記事の後半のパスフレーズを Twitter で DM していただければ、新しい記事をプレゼントしますのでお気軽にどうぞ。Twitter: @ytiskw
Riverpod を使った実用的な Flutter アーキテクチャを考えてみたので共有します。Riverpod って何やねん、という人は、こちらを先にご覧ください。新しい Flutter の状態管理パッケージです。パッケージは主に hooks_riverpod / flutter_hooks / freezed を使用します(全部同じ作者です。この人、すごいっす..)。
作るもの
最小限の Todo リストを作ります。ただし、データがメモリ内だけじゃつまらないので、SharedPreferences に永続保存するようにしていきます。これを外部 DB にすれば今回の内容は容易に転用可能です。
アプリでできることは以下です。
・入力されたテキストを Todo アイテムとして永続化できる
・永続された Todo リストを表示できる
・日付順を昇順、降順にしてソートできる
・完了を押すと完了フラグを永続化できる
アーキテクチャ図解
これから見ていくアーキテクチャを図解してみました。矢印はデータの流れを表します。登場人物は、Entity, Client, Repository, State, ViewController, View です。最小限の構成にしたかったので絞ったものもあります。
アプリが複雑化してきた時には Repository と ViewController の間に Usecase などを導入すると見通しが良くなりそうです。
ここで言っている Entity はDBに対応したデータの入れ物のことです。
View と Entity 以外は、Riverpod の Provider を元にして宣言されます。
それでは、それぞれ詳しくみていきましょう。
レポジトリはこちらにあります:https://github.com/ttlg/riverpod_todo/tree/old
ここから先は
¥ 720
この記事が気に入ったらサポートをしてみませんか?