作ったもの
これです。
作るに至る経緯
妻は腹膜透析を受けています。
一日3回自室で透析をしてその結果を記録する必要があるのですが
今までは記録用紙に記載していました。
少し計算したり、時間を測ったりしなきゃいけないのと
病院に行くときにはこの用紙を2週間分持っていく必要があるのが
ちょっと面倒そうだったのでいっちょ作ってみるか、となりました。
概要
腹膜透析を実施したときに記録する情報をLocalStrageに記録します。
DBも不要な静的ページだったのでGithubPagesで動作させています。
妻はPC持ってないのでスマホで使う前提のUIになってます。
各々の端末のブラウザのLocalStrageに保存するので
プライバシーやらの問題もないはずです。
同じような記録用紙を使ってる方なら問題なく使用できるはずですが
記録の仕方は病院によって異なるそうなので一概には言えません。
自動で入る値の仕様は以下の通り。
使い方は見てわかると思いますが
カレンダで日付を選択して日々の記録を保存するだけです。
病院には画面を見せるか印刷するかすれば伝わるようです。
（妻からの伝聞のため不鮮明）
ソースについて
Githubで公開しています。
gh-pagesブランチが最新でgh-pages-deployブランチが公開ページです。
GithubPagesはこちら。
保存を押下するとブラウザのLocalStrageに保存されますのであしからず。
技術的なお話
自分的には初めて状態管理にJotaiを使いました。
このアプリにはコンポーネントを大まかに下記のように分けています。
- 情報入力タブ×5
- 画面上部から引き出すドロアー
- カレンダー
それぞれで使う値を最新に保ちつつ、相互に参照するにはUseStateだと面倒だな
ということでこのJotaiはわかりやすかったです。
atomした値を他のコンポーネントでuseAtomするだけなので
UseStateからの載せ替えも楽ですね。
最後に
腹膜透析を受けている方が少しでも楽になりますように。