「時間を貯金する」Todoリストカレンダーアプリ
日々のタスクを貯金のように取り組めるWebアプリケーションです。
プログラミング経験10ヶ月目の初心者(化学専攻大学院生)による初投稿です。いろいろご容赦ください。
アプリ
このurlで実際に使うことができます！試しとして使ってください。
(ただ、データの永続化や個人情報の保護は一切保証しておりません。 ご利用は、ご自身の判断でお願いします。)
ソースコードも
ここから手に入れることができます！！
データベースはfirebaseを使用しているので、ご自身で環境変数を設定していただければ、自由に使ったり、カスタマイズしていただけます！
📋 プロジェクト概要
このアプリケーションは、「タスク管理」と「モチベーション維持」という個人の課題を解決するために開発したWebアプリケーションです。
独自のコンセプト
「時間を貯金する」というコンセプト
- 頑張ることでタスクの「猶予時間」が増加
- サボると猶予時間が減少
- 貯金感覚でタスクに取り組める仕組み
✨ 主要機能
👀各タスクの猶予時間の可視化
- カレンダーに登録された予定やタスク、睡眠時間などを差し引いた、『本当に残っている時間』を表示
📅カレンダー機能
- 単純なカレンダーとしても使用可能
- 繰り返し機能や編集機能などはもちろん使用可能
使い方(機能説明)
ログイン方法
アプリ画面右上の⚙マークから「googleでログイン」からログインできます！
(まだ、googleだけしか対応してないです🙇)
基本的な使い方
普通のカレンダーのように予定やタスクを登録していってください。
特殊なのはタスクの登録項目に「所要時間」というものがあります。
これはそのタスクを終わらせるのに何時間くらいかかるかを入力してください。
左下にはタスクのリスト表があります。
タスクを進めたら進めた分だけ「所要時間」を編集してください。
タスクを終わらせたらタスクを削除して下さい。
(※背景が赤くなっているタスクが優先すべきタスクです。)
右下には一時的なタスクのリストがあります。
期限などがわからず、とりあえず登録したいときに使ってください。
特殊な機能の説明
右上の⚙マークを押すと
というモーダルが出てくると思います。
そこで皆さんが疑問に思ったのは、詳細設定の項目の意味って何？ だと思いますので説明します！
-
一日あたり使える時間
これは言い換えると
「睡眠時間や生活時間を除いたタスクに充てることができる時間」
「何も予定がない日だと何時間分のタスクを処理できるのか」
です。ご自身で設定してください。 -
予定確定日
これは遠い日程だと予定が確定しておらず、そのせいでタスクの猶予時間も信頼できないものになっています。
ですので、この予定確定日に設定した日以降は次に説明する「予定未確定日の一日当たり使える時間」という暫定的な時間で計算するようになっています。 -
予定未確定日の一日当たり使える時間
これは、まだ予定が決まっていない日の使える時間を暫定的に決めるものです。
今までの一日あたりタスクに使えた時間の平均を設定するといいでしょう。
最後に
以上が今回作ったTodoリストカレンダーの概要です！
プログラミング始めたての初心者が作ったものなので、脆弱性やバグの多発は多いかもしれません。
このカレンダーを使ってみた感想や意見、アドバイスなどあればお気軽にご連絡していただければありがたいです！！(もちろんカレンダー以外のことも歓迎です！)
補足：猶予時間の計算(読まなくて大丈夫です)
猶予時間をどのように計算しているのかを解説します。
具体例を用いたほうがわかりやすいので、以下の具体例で解説します。
今日：2025/9/13
詳細設定
・一日当たり使える時間：8時間
・予定確定日：2025/9/15
・予定未確定日の一日当たり使える時間：5時間
予定
2025/9/14 10:00~17:00
2025/9/15 7:00~22:00
2025/9/16 10:00~18:00
タスク
タスク1:締め切り2025/9/15 所要時間:2時間
タスク2:締め切り2025/9/17 所要時間:8時間
この具体例で各タスクの猶予時間を計算します。
タスク1の猶予時間
9/13は予定がないので8時間(一日当たり使える時間で設定)使えます。
9/14は予定の時間(7時間)を引いて1時間使えます。
(9/15は締め切り日なので考慮にいれません)
合計9時間使えて、タスク1の所要時間は2時間なので
猶予時間は9時間-2時間= 「7時間」
タスク2の猶予時間
9/13 8時間使える。
9/14 1時間使える。
9/15 0時間使える。(予定の時間が15時間あるので)
9/16 5時間使える。(予定未確定日なので予定は考慮せず「予定未確定日の一日当たり使える時間」)
タスク2の締め切りより前にあるタスク1の所要時間の2時間分は引く
よってタスク2の猶予時間は
8時間+1時間+0時間+5時間-2時間-8時間(タスク2の所要時間)=4時間
というような計算になっています！
ちなみにこのぐらい例だと左下のタスクリストの表はタスク1、タスク2の両方が赤い背景になっています。
（理由）
一番猶予がないタスクはタスク2だが、
タスク1を取り組むことで間接的にタスク2の猶予時間を増やすことができるから。