---
# System prepended metadata

title: KT#003-kanejun 漢気アプリ
tags: [vue, otokogi, firebase]

---

# KT#003-kanejun 漢気アプリ

###### tags:`vue` `firebase` `otokogi`

### 背景
* 漢気ジャンケンの勝敗を記録したい
* 旧システムは村田研のWebサーバ上にあり、OBはログイン不可能、管理できない
    * 旧システムは裏でPHP/CSV管理。イケてないけど爆速。
* せっかくなので、イケてる感じにリメイクしたい

### アプリ
旧: https://www-mura.ist.osaka-u.ac.jp/personal/j-kaneda/otokogi/stat.php
新: https://otokogi-9bd58.firebaseapp.com

### 主な機能
1. ログイン不要（パブリック笑）
2. メンバー管理
3. 漢気記録機能
4. 統計機能
    * 全体統計
    * 指標別統計
    * 個人別統計
5. 統計際計算機能
6. イベント別集計←NEW!!
7. LINE Notifyで通知

### 技術
* Front: Vue + Vuetify + vue-chartjs
* Back: Firebase (Hosting, DB, Function)
![](https://i.imgur.com/1O1rF6Z.png)


### 旧システムとの差異
* 旧システムではページ閲覧のたびに統計の計算をしていたが、FirebaseではさすがにDBアクセスが頻発してお金かかりそうなので、統計情報を保持するようにした。
* 統計情報がでかくなりすぎて分割・データ間引きをした。
    * Firestoreでは1ドキュメント1MBまで
    * 推移グラフのデータは最多で1線当たり100ポイントになるように間引いている。
* 指標の追加削除、指標の定義見直し
* イベント機能（旧システムではシーズン制を採用していた）

### 今後の構想・課題
* PWA化したい。かんちゃんのLog4mjはしてるっぽい？
* データの修正機能実装
* パッド方式の入力にしたい
* いつかはデスクトップ対応
* ユーザ数が増えたらいつか1ドキュメント1MBの壁にぶつかる
* 変なキャッシュっぽいものが効いてる。うざい。
* 俺の漢気が強すぎてグラフが潰れる
* コロナのせいで女の子とデートできない
