yucatio@システムエンジニア

趣味で作ったものいろいろ

STEP 3での成果物 (STEP 3 : 他のユーザのタスクが見れるタスク管理アプリを作成する - React + Redux + Firebase チュートリアル)

★前回の記事

yucatio.hatenablog.com

STEP 3では、Cloud Functions for Firebaseを使用して、タスクの作成/更新があった時に、"最近の更新”に登録します。 ユーザは"最近の更新"から各ユーザのタスク一覧へジャンプすることができます。

f:id:yucatio:20181011124946p:plain

タスク一覧のURLは、/users/{ユーザID}/todosにするため、react-router-domを使用します。また、react-router-domをreduxと一緒に使うため、connected-react-routerを利用します。

f:id:yucatio:20181011125247p:plain

自分のタスクのみ編集できるように変更もします。

f:id:yucatio:20181011130157p:plain

"最近の更新”は、そのままだとどんどんデータが溜まってしまうので、Cloud Functionsを利用して適宜一定の数以下になるよう、古いデータを削除するようにします。

それでは、STEP 3のチュートリアルを始めましょう。

★次回の記事

yucatio.hatenablog.com

★目次

yucatio.hatenablog.com