Project-記帳本

更新於 發佈於 閱讀時間約 2 分鐘

選擇此專案的原因

  現在人奢侈花費變多,常常到月底回想不起自己金錢的去向,因而產生無止境的焦慮,因此希望做一個精簡的記帳專案,讓大家可以輕鬆地記錄自己的支出,還能檢視不同類別的花費以做開銷調整。

使用的技術

  1. 用express-handlebars作為此專案的引擎樣板,並搭配connect-flash套件去給予使用者一些錯誤或成功的提示,以提升使用者感受
  2. 用mongoose操作mongodb
  3. 用method-override套件,使得路由命名符合RESTful 風格
  4. 用passport.js作為驗證系統之認證使用者的部分,而儲存認證結果則用express-session
  5. 用bcryptjs將註冊者的密碼加密
  6. 用dotenv將私密資訊另外紀錄
  7. 使用async/await 方式處理非同步函式

實作心得

  雖不是第一次做專案,但還在摸索自己實作過程時的順序,常常有想法卻會猶豫該從哪裡開始,也因這個專案發現這個問題,有特地停下來思索出一個目前認為較適合自己的開發順序。

  比較挫折的部分是Html,花了很多時間在調整樣式,一直以來都是用flexbox的方式去做版面的對齊,但發現當內容物每列長度不一,而想要每列的欄區塊對齊時,實作上會有難度,後來查找「欄列對齊」的相關資料,發現有grid可以簡單的解決此問題,因此在new.handlebars內就有用到此方法。

  而此專案我選擇用async/await方式處理非同步函式是因為在閱讀程式碼時,能更直覺知道執行順序。印象深刻的部分是在使用try{}把非同步部分包起來時,原先看網路範例以為只要包住前面有await的函示就好,結果執行時就發生錯誤,才發現若只是包住單行,而下面的變數會有跟此非同步函是有關的部分,並不會等待非同步那行執行完,因此會找不到資料,故要將所有跟非同步相關的部分就包在try{}內,才能正確執行。

反思

  開發流暢度可透過建立一個固定的開發步驟去提升;平時可多看bootstrap文件了解裡面可使用的東西,並再多熟悉html本身的內設和屬性,以提升切版速度;此外對於此專案使用的大多技術都尚處於半知半解的狀態,期望自己能再多理解背後相關概念,並再未來開發時多使用這些套件內的不同功能以加深對套件的熟悉程度。



留言
avatar-img
留言分享你的想法!
avatar-img
林采婷的沙龍
0會員
4內容數
林采婷的沙龍的其他內容
2023/11/15
作為全職工作的人,只能利用下班時間去學習,也想過是否離職全職學習,可是評估過自己的經濟壓力,還是決定繼續工作,另一部分也是因為尚未確認是否要將軟體工程當成下一份工作的目標。 因為非本科生,加上學習時間有限,從學期一到三的進度對我來說真的都很有壓力,這部分也是期待alphacamp有機會能去調整
2023/11/15
作為全職工作的人,只能利用下班時間去學習,也想過是否離職全職學習,可是評估過自己的經濟壓力,還是決定繼續工作,另一部分也是因為尚未確認是否要將軟體工程當成下一份工作的目標。 因為非本科生,加上學習時間有限,從學期一到三的進度對我來說真的都很有壓力,這部分也是期待alphacamp有機會能去調整
2023/06/27
緣起 在alpha camp的學習終於來到第二學期的最後,在寫期末考作業時需要將產生的新網址,透過按按鈕就能直接複製,而沒有做過這個功能的我當然是毫無頭緒......。 過程 沒頭緒時,當然是在google上開始搜尋,「how to copy by press button?」,沒錯,通常我就是這麼
2023/06/27
緣起 在alpha camp的學習終於來到第二學期的最後,在寫期末考作業時需要將產生的新網址,透過按按鈕就能直接複製,而沒有做過這個功能的我當然是毫無頭緒......。 過程 沒頭緒時,當然是在google上開始搜尋,「how to copy by press button?」,沒錯,通常我就是這麼
2023/04/29
學習成果 了解了javascript內array和object的結構,以及簡單的語法,接著學到了如何自己撰寫函式;而在HTML和CSS的部分,習得position的分類和使用方式,以及bootstrap;此外,學會用javascript操弄DOM以動態修改網頁內容,並設置監聽器達成想要有的特定功能
2023/04/29
學習成果 了解了javascript內array和object的結構,以及簡單的語法,接著學到了如何自己撰寫函式;而在HTML和CSS的部分,習得position的分類和使用方式,以及bootstrap;此外,學會用javascript操弄DOM以動態修改網頁內容,並設置監聽器達成想要有的特定功能
看更多
你可能也想看
Thumbnail
創作者營運專員/經理(Operations Specialist/Manager)將負責對平台成長及收入至關重要的 Partnership 夥伴創作者開發及營運。你將發揮對知識與內容變現、影響力變現的精準判斷力,找到你心中的潛力新星或有聲量的中大型創作者加入 vocus。
Thumbnail
創作者營運專員/經理(Operations Specialist/Manager)將負責對平台成長及收入至關重要的 Partnership 夥伴創作者開發及營運。你將發揮對知識與內容變現、影響力變現的精準判斷力,找到你心中的潛力新星或有聲量的中大型創作者加入 vocus。
Thumbnail
本文介紹了自我省思的四個步驟:客觀紀錄、分析總結、提出解法、結果分享。通過紀錄事情緣由、分析和總結,提出改進方法,並對結果進行分享,以避免再犯類似的問題。詳細分析了心態問題和做事方法方面的缺陷,並提出改進對策。
Thumbnail
本文介紹了自我省思的四個步驟:客觀紀錄、分析總結、提出解法、結果分享。通過紀錄事情緣由、分析和總結,提出改進方法,並對結果進行分享,以避免再犯類似的問題。詳細分析了心態問題和做事方法方面的缺陷,並提出改進對策。
Thumbnail
第四步驟 :建立自己的任務管理系統 白話一點說,任務管理系統 = To Do List 說實話,我一直以為自己的工作內容算是單純,沒有特別想過要使用To Do List,後來拆解每天的代辦事項之後,驚覺於公、於私,每天超過30項代辦事項,但是神(ㄓㄨ)腦(ㄊㄡˊ)如我,想靠著好記性去記憶所有事情
Thumbnail
第四步驟 :建立自己的任務管理系統 白話一點說,任務管理系統 = To Do List 說實話,我一直以為自己的工作內容算是單純,沒有特別想過要使用To Do List,後來拆解每天的代辦事項之後,驚覺於公、於私,每天超過30項代辦事項,但是神(ㄓㄨ)腦(ㄊㄡˊ)如我,想靠著好記性去記憶所有事情
Thumbnail
在以前我對於繳費、繳交作業、答應他人做的事時,我並沒有太在意,時而拖延時而忘記,有時候明明記得要去繳交帳單,我就會想「喔!時間還有,明天再去做...明天...」或是說答應跟人約好的時間遲到了,變成習慣性的拖延完成一些事,還有很多很多 ... ... 浪費他人時間也是,這些小小的行為,都會讓我們在未來
Thumbnail
在以前我對於繳費、繳交作業、答應他人做的事時,我並沒有太在意,時而拖延時而忘記,有時候明明記得要去繳交帳單,我就會想「喔!時間還有,明天再去做...明天...」或是說答應跟人約好的時間遲到了,變成習慣性的拖延完成一些事,還有很多很多 ... ... 浪費他人時間也是,這些小小的行為,都會讓我們在未來
Thumbnail
為什麼有些人很會時間管理?代表它們很會規畫時間,以及應變力強。
Thumbnail
為什麼有些人很會時間管理?代表它們很會規畫時間,以及應變力強。
Thumbnail
時間管理 技巧一:縱覽全局、明訂目標 時間管理 技巧二:善用零碎時間 時間管理 技巧三:根據目標校正心態
Thumbnail
時間管理 技巧一:縱覽全局、明訂目標 時間管理 技巧二:善用零碎時間 時間管理 技巧三:根據目標校正心態
Thumbnail
工作到現在4年了,都是面臨20億以上的工程,雜事非常多,所以導致常常忘東忘西。   一次的偶然下,被同事推薦了〈子彈筆記法〉,「沒用不知道,一用不得了」,使用一段時間後我發現餘裕時間變得很多。   以前都是被事情追著跑,現在是終於有時間可以開始學習。
Thumbnail
工作到現在4年了,都是面臨20億以上的工程,雜事非常多,所以導致常常忘東忘西。   一次的偶然下,被同事推薦了〈子彈筆記法〉,「沒用不知道,一用不得了」,使用一段時間後我發現餘裕時間變得很多。   以前都是被事情追著跑,現在是終於有時間可以開始學習。
Thumbnail
你有沒有過以下類似的經驗: 覺得事情好多怎麼都忙不完? 學了時間管理法卻總是無法落實? 知道要行動但壓力好大一直拖延?
Thumbnail
你有沒有過以下類似的經驗: 覺得事情好多怎麼都忙不完? 學了時間管理法卻總是無法落實? 知道要行動但壓力好大一直拖延?
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News