發表文章

目前顯示的是 6月, 2022的文章

廣志美冴的家庭記帳本(登入憑證、關聯性資料、async await練習)[Alpha Camp學期 3後端第二週]

圖片
專案介紹: 一個以使用者登入方式擁有的私人記帳本,可以自建帳號也可以用FB、Goggle帳號登入。 記帳本除了瀏覽所有支出細項外,可以很方便的新增、編輯、刪除一筆支出,也可以依分類簡單看出該類別花費金額。 你為何會選擇這個專案? 做一個自己順眼的記帳本幫助自己日常開銷紀錄和控管。另外記帳本有資料庫CRUD、身分認證等需求,對於學習相關套件和語法是個還不錯的練習。 你使用了什麼技術或套件? 除了Node.js、Express.js基礎框架外, 使用express-handlebars樣板處理畫面渲染,並搭配connect-flash讓partial handlebar做訊息警示 使用method-override實現CRUD路由RESTful語意化 使用mongoose物件映設連線MongoDB資料庫 使用dotenv設定統一放置環境變數,並以.gitignore隱藏避免個人設定外洩 使用passport及相關local、facebook、google策略進行身分驗證 使用bcryptjs密碼雜湊,增加資訊安全性 使用bootstrap和font awesome美化也簡化CSS樣式 使用async await語法糖搭配promise all,優化callback hell槽狀結構由外向內問題,讓程式碼由上到下更簡潔易讀 使用MVC架構,增加功能獨立性 使用heroku佈署網頁 哪部分你相對能掌握?哪裡花了最多時間? 對於 各個套件的語法雖然不能直接默寫出來,但查閱文件後都還算能掌握。另外對於promise的.then().catch用法相當熟悉,與資料庫的溝通、model建立、種子資料設計和資料關聯性都還算順手。 在這個專案裡,讓我花較多時間的除了bootstrap切版外,就是async await語法糖的用法,發現這種寫法讓程式碼更簡潔容易閱讀,特地先查找資料學習後再回專案裡練習,中途還一度發現沒有catch到error訊息,再重新翻找相關資訊學到try catch語法。 過程中碰到什麼困難?又如何克服?(例如:查找網路文件) 由於很多套件都是新學,常遇到語法不熟悉的狀況,我就常在網上查找相關文件和討論範例。像是課程中提到LocalStrategy和FacebookStrategy語法,但我在做專案時還想多加GoogleStrategy,於是就多花點時間從原始文件和

Git&Github、Node.js&Express.js、CRUD&MongoDB、Heroku&... 其他挑戰[Alpha Camp學期 2-3後端]

圖片
  第一週- 網路概論&Node.js、Express與相關樣板套件使用 接續上學期末提到的git&github,原本模模糊糊的指令操作,在這學期變成必備的基本技能了,果然就是欠練習!😂 進到這學期馬上就來了個震撼彈:各種沒接觸過的模板、套件的安裝應用和Terminal指令。在這過程中,出現各種卡關,原本表定一週的課程,光是"安裝"就足足多花了一週的時間,雖然回頭看都是些根本不是問題的問題,還是不小的打擊了原本以為擁有滿滿JS、HTML、CSS能力的信心。 這週一步一步的練習初始化專案、樣板引擎、靜態畫面&動態資料渲染、動態路由,不得不說,AC課程教得真的很仔細! 還在每一步的停頓也帶著同學git commit一次,讓原本對git指令很混亂的我,這麼多次的重複練習後也變得熟悉起來。 這週的結尾以餐廳清單網頁初級版作業和被打擊轉為謙卑的心作為終結😂。 這學期初還是完成了一個side project - 樂透轉盤  ( replit程式碼 ),主要用的是上學期最後教的MVC概念,另外應用DOM event listener、local storage,再加上一些自己玩的CSS,有緣人可以在右下角找到音樂撥放鍵(個人建議心情不好可以來按一下,馬上就開心起來😂)。 這次side project在這週課程衝擊下還沒辦法用到新學到的課程內容,但在這個課程轉折點來說,是個不錯的練習,相當於把我在前三學期的課程做了一個自我測驗。 第二週- CRUD&MongoDB 這週先從一個密碼產生器製作開始,讓我們注意到<form> method的GET和POST用法的差異及不同input型態得到的value的不同。 接著開始了經典的Todo List的CRUD的一步步講解實作,並帶入MongoDB及Mongoose使用,也多了seed資料匯入的作法。 整體來說這週還算愉快。在上週的洗禮後,本週在express專案初始化和各個套件安裝匯入使用上都感覺熟悉了 一點。直到MongoDB的環境設定的地方才又莫名其妙的卡關,設定方法有在terminal設定或是電腦系統設定兩種方式,由於常同時編輯不同專案,這兩種方式對我來說都相當不方便也很容易忘記修改參數而出問題,在無數次錯誤訊息出現debug到眼花之後,後來用了dotenv套件把變