【タスク設計】teams/{teamId}/tasks/{taskId} に保存する項目を決める
このページでやること
このページでは、タスクをFirestoreに保存するときの形を決めます。
タスクとは、チームの中で管理する作業のことです。
今回の保存場所はここです。
teams/{teamId}/tasks/{taskId}
短く言うと、こうです。
チームの中に
↓
そのチーム専用のタスクを保存する
今日のゴール
次のようなタスクデータを作る準備をします。
teams/{teamId}/tasks/{taskId}
title: タスク名
description: タスクの説明
status: todo
priority: normal
assigneeEmail: 担当者メール
assigneeId: 担当者のuid
createdBy: 作成者のuid
createdAt: 作成日時
updatedAt: 更新日時
このページでは、まだタスク作成画面は作りません。
まずは、どんな項目を保存するかを整理します。
このページで出てくる単語
| 単語 | 一言説明 |
|---|---|
task | タスク。やるべき作業 |
taskId | タスクごとのID |
title | タスク名 |
description | タスクの説明 |
status | 進行状況 |
priority | 優先度 |
assignee | 担当者 |
createdBy | 作成者 |
createdAt | 作成日時 |
updatedAt | 更新日時 |
ID とは、データを見分けるための名前や番号です。
npmや環境変数はこのページで必要?
このページでは、npmは使いません。
環境変数も設定しません。
このページでやることは、Firestoreに保存するタスクの形を決めることです。
タスクに必要な項目を確認する
↓
保存場所を確認する
↓
次のタスク一覧画面に進む
Step 1:保存場所を確認する
今回のタスクは、チームごとに保存します。
保存場所はここです。
teams/{teamId}/tasks/{taskId}
たとえば、teamId が team001 の場合は、こうなります。
teams/team001/tasks/{taskId}
さらに、taskId が task001 なら、こうです。
teams/team001/tasks/task001
Step 2:なぜteamsの中にtasksを入れるのか
タスクは、チームごとに分けたいからです。
たとえば、次のようにチームが2つあるとします。
開発チーム
営業チーム
それぞれのタスクは違います。
開発チーム
ログイン画面を作る
Firestore接続を確認する
営業チーム
見積書を送る
打ち合わせ日程を確認する
これを混ぜたくないので、タスクはチームの中に保存します。
teams/{teamId}/tasks/{taskId}
Step 3:保存する項目を決める
今回のタスクには、次の項目を保存します。
| 項目 | 保存する内容 |
|---|---|
title | タスク名 |
description | タスクの詳しい説明 |
status | 未対応・進行中・完了 |
priority | 優先度 |
assigneeEmail | 担当者メール |
assigneeId | 担当者のuid |
createdBy | タスクを作った人のuid |
createdAt | 作成日時 |
updatedAt | 更新日時 |
最初は多く見えますが、1つずつ見るとシンプルです。
Step 4:titleを決める
title は、タスク名です。
例:
ログイン画面を作る
資料を確認する
見積書を送る
Firestoreでは、こう保存します。
title: ログイン画面を作る
title は必須にします。
必須とは、必ず入力する項目という意味です。
Step 5:descriptionを決める
description は、タスクの詳しい説明です。
例:
メールアドレスとパスワードでログインできる画面を作る。
エラー表示も入れる。
Firestoreでは、こう保存します。
description: メールアドレスとパスワードでログインできる画面を作る。
description は空でもOKにします。
短いタスクなら、説明がなくても使えるからです。
Step 6:statusを決める
status は、タスクの進行状況です。
今回使う値は3つです。
| status | 表示名 | 意味 |
|---|---|---|
todo | 未対応 | まだ着手していない |
doing | 進行中 | 今作業している |
done | 完了 | 作業が終わった |
最初にタスクを作るときは、基本的に todo にします。
status: todo
Step 7:priorityを決める
priority は、優先度です。
今回使う値は3つです。
| priority | 表示名 | 意味 |
|---|---|---|
low | 低 | 急ぎではない |
normal | 中 | 通常 |
high | 高 | 優先して対応する |
最初は、迷わないように normal を初期値にします。
priority: normal
Step 8:assigneeEmailを決める
assigneeEmail は、担当者のメールアドレスです。
担当者とは、そのタスクをやる人のことです。
例:
assigneeEmail: yamada@example.com
最初の実装では、担当者メールを入力できるようにします。
まだ担当者を決めない場合は、空文字でもOKにします。
assigneeEmail:
Step 9:assigneeIdを決める
assigneeId は、担当者の uid です。
uid は、Firebase Authenticationがユーザーごとに作るIDです。
例:
assigneeId: abc123
ただし、最初の実装では、メールだけ入力して、uid はあとで検索して入れる形でもOKです。
そのため、最初は空文字にしておきます。
assigneeId:
あとでメンバー追加や担当者選択を作るときに、正しく入れていきます。
Step 10:createdByを決める
createdBy は、タスクを作った人の uid です。
例:
createdBy: abc123
これは、ログイン中のユーザーから取得します。
Flutterでは、あとで次のように取ります。
final user = FirebaseAuth.instance.currentUser;
そして、保存時にこう使います。
createdBy: user.uid
Step 11:createdAtとupdatedAtを決める
createdAt は作成日時です。
updatedAt は更新日時です。
Firestoreでは、次を使って保存します。
FieldValue.serverTimestamp()
保存イメージはこうです。
createdAt: FieldValue.serverTimestamp()
updatedAt: FieldValue.serverTimestamp()
serverTimestamp() は、Firestore側の現在時刻を入れる命令です。
スマホやパソコンの時計ではなく、Firebase側の時刻を使います。
Step 12:完成形のタスクデータ
最初に作るタスクデータは、この形にします。
{
'title': title,
'description': description,
'status': 'todo',
'priority': priority,
'assigneeEmail': assigneeEmail,
'assigneeId': '',
'createdBy': user.uid,
'createdAt': FieldValue.serverTimestamp(),
'updatedAt': FieldValue.serverTimestamp(),
}
Firestore上では、たとえばこう見えます。
teams/team001/tasks/task001
title: ログイン画面を作る
description: メールアドレスとパスワードでログインするUIを作る
status: todo
priority: normal
assigneeEmail: yamada@example.com
assigneeId:
createdBy: abc123
createdAt: 作成日時
updatedAt: 更新日時
Step 13:画面で使う項目
タスク一覧画面では、主にこの項目を使います。
| 画面表示 | 使う項目 |
|---|---|
| タスク名 | title |
| 説明 | description |
| 状態ラベル | status |
| 優先度ラベル | priority |
| 担当者 | assigneeEmail |
最初は、これだけ見えれば十分です。
Step 14:タスク作成画面で入力する項目
タスク作成画面では、まず次の4つを入力できるようにします。
| 入力項目 | Firestoreの項目 |
|---|---|
| タスク名 | title |
| 説明 | description |
| 優先度 | priority |
| 担当者メール | assigneeEmail |
status は、新規作成時は自動で todo にします。
createdBy、createdAt、updatedAt も自動で入れます。
Step 15:ステータス変更で使う項目
あとで、タスクを「未対応 → 進行中 → 完了」に変える処理を作ります。
そのときは、この項目を更新します。
status
updatedAt
例:
status: doing
updatedAt: 更新日時
完了にしたときは、こうです。
status: done
updatedAt: 更新日時
Step 16:Firestoreでの最終イメージ
全体としては、次の形になります。
teams
└ team001
├ name: 開発チーム
├ ownerId: abc123
├ memberIds: [abc123]
│
└ tasks
└ task001
├ title: ログイン画面を作る
├ description: メールとパスワードの入力欄を作る
├ status: todo
├ priority: normal
├ assigneeEmail: yamada@example.com
├ assigneeId:
├ createdBy: abc123
├ createdAt: 作成日時
└ updatedAt: 更新日時
この形を使って、次のページからタスク一覧画面を作ります。
よくある混乱ポイント
| 混乱すること | 考え方 |
|---|---|
createdBy と assigneeId の違い | createdBy は作った人、assigneeId は担当者 |
status と priority の違い | status は進み具合、priority は重要度 |
createdAt と updatedAt の違い | 作成日時と更新日時 |
| なぜtasksをteamsの中に入れるのか | チームごとにタスクを分けるため |
assigneeEmail と assigneeId の違い | メールは表示・入力用、uidは正確な識別用 |
最短まとめ
読むのが大変な人は、ここだけ見てください。
タスクの保存場所はここです。
teams/{teamId}/tasks/{taskId}
保存する項目はこれです。
title
description
status
priority
assigneeEmail
assigneeId
createdBy
createdAt
updatedAt
最初に作るときは、こうします。
status: todo
priority: normal
assigneeId: 空文字
createdBy: ログイン中ユーザーのuid
createdAt: Firestore側の現在時刻
updatedAt: Firestore側の現在時刻
チェックリスト
□ tasksの保存場所を理解した
□ teams/{teamId}/tasks/{taskId} の形を確認した
□ titleを保存することを確認した
□ descriptionを保存することを確認した
□ statusを保存することを確認した
□ priorityを保存することを確認した
□ assigneeEmailを保存することを確認した
□ assigneeIdを保存することを確認した
□ createdByを保存することを確認した
□ createdAtを保存することを確認した
□ updatedAtを保存することを確認した
ミニ確認問題
Q1. タスクはFirestoreのどこに保存しますか?
回答
次の場所に保存します。
teams/{teamId}/tasks/{taskId}
Q2. status は何を表しますか?
回答
タスクの進行状況を表します。
今回使う値は、todo、doing、done です。
Q3. priority は何を表しますか?
回答
タスクの優先度を表します。
今回使う値は、low、normal、high です。
Q4. createdBy には何を入れますか?
回答
タスクを作ったログイン中ユーザーの uid を入れます。
Q5. このページでnpmや環境変数は必要ですか?
回答
必要ありません。
このページでは、タスクデータの設計を決めるだけです。
このページのまとめ
- タスクは
teams/{teamId}/tasks/{taskId}に保存する。 - チームの中にタスクを入れることで、チームごとに作業を分けられる。
titleはタスク名。descriptionはタスク説明。statusは進行状況。priorityは優先度。assigneeEmailは担当者メール。assigneeIdは担当者uid。createdByは作成者uid。createdAtは作成日時。updatedAtは更新日時。- このページではnpmや環境変数は不要。
次のページでやること
次のページでは、チームをタップしてタスク一覧画面へ移動します。
teamId と teamName を渡して、そのチーム専用のタスク一覧画面を開きます。
