NowLoading...

ColorFull ToDo

https://github.com/MIYABETaisei/todo-app

TypeScript

TypeScript

Next.js

Next.js

Firestore

Firestore

Firebase

Firebase

ToDoアプリです!

ユーザーアイコン

山下純一

MacBook
サムネイル

推しアイデア

なるべく直感的なUIUXとひとめでみたときのタスクの重要度合いがわかるようになってます またGoogleカレンダー上にも同時に登録されるのでわざわざGoogleカレンダーを編集しなくてもよい!

作った背景

自分がタスクが溜まるとストレスで「おなか」がいたくなってしまうのでなんとか整理したい!!!

推し技術

dnd-kitというパッケージを使うことでカードを掴んだり移動させたりが直感的

プロジェクト詳細

Todoアプリです!

できること

  • メール,Googleアカウントで新規登録ログインログアウトができる
  • タスクタイトルと期日,ラベルカラーを登録
  • ToDo,Doing,Doneのレーンをカードを掴んで移動できる
  • 登録した情報を編集できる(レーン上の情報もリアルタイムで変更される)
  • タスクの削除ができる
  • タスクの期限が迫っていることを右下の顔アイコンと色で確認できる
  • アプリ内の情報をFireStore上に保存できる
  • ログアウトするとログイン画面に戻ってくる

使用技術

TypeScript/Next.js dnd-kit/mantine FirebaseDatabese/FirebaseAuthentication GoogleCalenderAPI TailwindCSS

まとめ

  • ToDoアプリとしての最低限のフル機能ができた
  • Googleカレンダーの操作がとても難しかった(認証トークン周り...)
  • ハッカソン初参加たのしかった!!
山下純一

山下純一

@bd4caff1f97800f7