3連休を使ってfirebaseに入門した。土曜日はだいたいドキュメントを眺めて、日曜日と月曜日で適当なアプリを作った。
https://github.com/krtx/quota-system
技術
- firebase(authentication, firestore, hosting)
- react + typescript
- material-ui
作ったもの
継続的に実施するタスクを管理するためのウェブアプリで、タスク毎に目標達成回数が指定できて、ボタンを押すと達成回数をインクリメントできるもの（SOFT SKILLSに書いてあったクオータシステム）
https://quota-system.firebaseapp.com/
時系列
1日目はfirebaseの理解となんとなく動くところまでを目標にした。当然ユーザの概念を入れてユーザ毎に異なるタスク管理をできるようにしたかったが、時間がかかりそうだったのでやめて、ボタンを押してインクリメントできるところまでを作った。Reactを使ったがReactの最初のセットアップで昔作った別のアプリの設定をコピペしてきたら動かなくてはまる。結局create-react-appを使えばよかったという話で、webpackやらの理解をしたいわけではなかったので、この辺は賢くやるべきだった。まあまあ動いたのでOK。material-uiを使って、適当に作ってもそれっぽい見た目になって便利。最低限の機能を実装するところまでできればいいので見た目はどうでもいいという思いと、それっぽい見た目で作りたいという思いがコンフリクトする。
2日目はもう少し体裁を整えたのとタスクの追加ができるところまで。
3日目でAuthenticationを使ってユーザの概念を入れた。セッションをどうするのかわからなくて最初迷ったが、firebaseがすべて面倒を見てくれることに気付いてあとは適当に実装した。`.onAuthStateChanged` で認証状態の変更を検知できるのだが、単にfetchするだけでいいのにな、と思った。全体的に普通のDBだと思って作ってしまったので、良くないかもしれない。
次
- firestoreもうちょっと理解しよう
- リアルタイムチャットのチュートリアルをやろう
- 使い捨てのリアルタイムチャットシステムを作ってみよう
- service worker理解しよう
