# 時間記帳本(Time ledger)
###### tags: `time management` `project`

## Overview: 5W1H 規劃
### What (做什麼)
時間記帳本是一個紀錄時間的應用
可以幫助使用者：
- 方便的紀錄時間
- 客製化細部項目
- 快速紀錄時間以及當下狀態
- 資料分析
- 讓時間使用情況以及當下狀態圖表化可視化
- 讓使用者可以自由的下載以及管理自己的時間紀錄

### Why (為什麼要做)
時間管理和精力管理是生命中最重要的事
但是目前沒有相關的應用在幫人們優化個人級別的時間管理
所以我們想做一個能夠讓人很方便紀錄時間的工具,讓人快速紀錄當下時間和狀態,並且可視化資料
讓使用者可以更輕鬆的管理自己的時間和精力
### Where (在哪裡做)
團隊：線上為主
如果未來做得好,可以申請計畫或投比賽
### When (做這件事的時間)
慢慢做
### Who (做這件事的人)
-
### How (如何做)
協作程式碼庫：Github
共筆平台：-

## About
### 功能
- auth
- 註冊
- 登入
- 登出
- tag
- tag CRUD
- add to favorite
- category
- category CRUD
- add to favorite
- field
- field CRUD
- add to favorite
- record
- record CRUD

### 資料庫設計
https://dbdiagram.io/d/60ddab06dd6a5971482828d7

資料庫可能還要再討論
我自己是想要做有彈性和可擴展的模型

想法:
用 template 表去裝所有的紀錄格式
每個時間紀錄都必須連接到一個 template
使用者可直接使用團隊建立的 template 或是自己新建
也可以拿團隊的 template 去小修改就使用
template 包含以下

  id uuid [pk]
  title varchar
  description text
  creator uuid
  tag [uuid]
  category uuid
  sub_templates [Template]
  meta json
}

其中 sub_templates 是 template 包含的其他 template (功能是繼承,可以繼承上一個 template 所有格式)
meta 是 template 自己的格式
頁面必須按照 template 渲染出不同的 form
另外 meta 也可以描述格子中其他的資訊
例如：
- 類型
- choice
- options: ["A","B","C"]
- form
- drop_down
- choice
- text
- input_box
- int
- input_box
- number
- input_box
- float
- input_box
- form 類型
- 選單類型
- 下拉式(drop_down)
- 選擇式(choice)
- 輸入框(input_box)
- 預設值

範例：

"field_name":{
    "type":"text",
    "form":"input_box",
    "default":""

}

Record 創建的時候,需要的 args
- creatorId
- templateId
之後修改時後端會解析template並生成對應的 form,再用 form submit 的資料來寫入 record 的 meta
### 頁面設計
#### 紀錄
- auth
- login
- sign up
- forget password
- reset password
- template
- template list
- query
- my template
- famous template
- template detail
- template create
- record
- my record list (only see user's record) -> in want other's to see can use share record(visibility)
- query
- tag
- time period
- record detail
- other's record
- personal info
- detail
- content
- FullName
- Username
- Avatar
- link to my template
- link to my records
- favorite templates
- favorite tags
- favorite catgories
- edit

#### 分析

- time distrbution(圓餅圖)
- 折線圖
- 根據使用者設計的量表來做劃分
- ex:
- 生產力
- 心情
- 疲勞程度

### 版本計畫
第一測試版:
- 紀錄時間功能
- 紀錄基本項目
- 新增個人客製化紀錄項目
- 客製化紀錄面板
- 客製化會出現的項目

第二測試版：
- 資料可視化功能
- 生成圖表
- 時間分佈圓餅圖
- 一日專注力圖表
- 匯出紀錄功能
- 圖表
- 資料
- csv
- xlsx
### 預計使用技術
- redwood.js -> full stack framework for startup
- programming language
- Typescript
- frontend
- frontend framework
- React.js
- css framework
- tailwindcss
- UI library
- MUI:https://mui.com/
- vechai-ui
- react-bootstrap
- api (backend)
- ORM
- prisma
- api fromat
- graphQL
- test
- jest

### 開發行程
先用 figma 做出模擬 app 的程式

### 社群導向計畫
- 社群分享紀錄模板功能
- 使用他人模板功能
- 社群分享分析模板(分析特定的紀錄模板)
- 圖像
- AI
-
- 使用他人分析模板

## 項目定位
專為時間管理設計的 google 表單 + 自定義工具(預設值) + 社交工具(引用,使用,建構在他人模板上)
假設用 google 表單來做,就等於每個模板使用一個 google 表單

## 可參考的範例和套件
### React Google Forms Hooks：https://www.npmjs.com/package/react-google-forms-hooks
example: https://codesandbox.io/examples/package/react-google-forms-hooks

## 其他
資料視覺化：streamlit