- 使用者可以註冊帳號
- 註冊之後，可以登入/登出
- 只有登入狀態的使用者可以看到 app 內容，否則一律被導向登入頁
- 在首頁一次瀏覽所有支出的清單
- 使用者只能看到自己建立的資料
- 在首頁看到所有支出清單的總金額
- 新增一筆支出
- 編輯支出的屬性 (一次只能編輯一筆)
- 刪除任何一筆支出 (一次只能刪除一筆)
- 根據「類別」篩選支出；總金額的計算只會包括被篩選出來的支出總和
-
將本專案 clone 到本地端
-
安裝套件
npm install [email protected]
npm i [email protected] # Mac M1 chip
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected] [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]-
建立 .env 環境變數檔案, 可參考 .env.example 檔案
-
資料庫連線設定，本專案使用 Robo 3T GUI:
export MONGODB_URI="mongodb+srv://<your name>:<your password>@cluster0.ayhtm.mongodb.net/expense-tracker-list?retryWrites=true&w=majority"- 新增種子資料到資料庫，在終端機執行:
npm run seed- 種子資料新增成功，會看到以下訊息:
category done!
record done!- 啟動伺服器
npm run start- 終端機啟動成功會顯示以下訊息
App is running on http://localhost:3000
mongodb connected!