見出し画像

【更新版】 Riverpod 1.0 による実用的なアーキテクチャを Todo リストを例に考えてみる

Riverpod 1.0を使った実用的な Flutter アーキテクチャを考えてみたので共有します。Riverpod ってなに?という人は、先にこちらをご覧ください。Flutter の状態管理パッケージなどができる神パッケージです。パッケージは主に hooks_riverpod / flutter_hooks を使用します。

作るもの

最小限の Todo リストを作ります。ただし、データがメモリ内だけじゃつまらないので、SharedPreferences に永続保存するようにしていきます。これを外部 DB にすれば今回の内容は容易に転用可能です。
アプリでできることは以下です。
・入力されたテキストを Todo アイテムとして永続化できる
・永続された Todo リストを表示できる
・日付順を昇順、降順にしてソートできる
・完了を押すと完了フラグを永続化できる

画像2

アーキテクチャ図解

これから見ていくアーキテクチャを図解してみました。矢印はデータの流れを表します。登場人物は、Entity, Repository, State, ViewController, View です。最小限の構成にしたかったので絞ったものもあります。

画像1

アプリが複雑化してきた時には Repository と ViewController の間にレイヤーを挟むと見通しが良くなりそうです。
ここで言っている Entity はDBに対応したデータの入れ物のことです。
View と Entity 以外は、Riverpod の Provider を元にして宣言されます。
それでは、それぞれ詳しくみていきましょう。

レポジトリはこちらにあります:https://github.com/ttlg/riverpod_todo

ここから先は

3,401字

¥ 700

期間限定 PayPay支払いすると抽選でお得に!

この記事が気に入ったらサポートをしてみませんか?