系列文章
Day11 整合人事資料
後端站台在成功驗證並取得請求來源的身份資訊後，可以開始整合基本人員組織資料。過去取得人資檔案需要先掌握全公司的人事與組織資料，模式通常是每日同步一份公司人事與組...
Day12 Backend API 彙整資料並回傳至前端
Backend API 已經可以接收前端的呼叫需求，HR API Service 取得人事資料的部分也完成了。接下來要透過 Backend API 進行整合，並...
Day13 前端收到資料了，可以顯示於介面上囉
成功從後端取得資料後，接著就是要將後端回傳的資料呈現於介面中，本章節我們希望可以達到以下目的： 呼叫後端 API，成功取得登入者資訊 取得回應後的資訊並存放於...
Day14 Store 存取機制
Day13 提到 localStorage 的儲存方式，可於瀏覽器本地保存資料到使用者電腦，資料會永久保留，除非使用者主動清除。localStorage 適合保...
Day15 Azure Pipeline 可以幫我們的事(一)
前面討論到前端、後端、以及外部人事資料串接的實作後，終於要部署到測試環境，並且可以讓整個 source code 發 PR 到 develop 分支了。Day5...
Day16 Azure Pipeline 可以幫我們的事(二)
AI審查 可針對你當次 PR 修改的檔案進行靜態分析與審查，於 PR 單中自動產生審查意見與修改建議。團隊在初期有導入，但後期覺得太囉嗦，暫時先關閉。如果團隊對...
Day17 透過 Filter 控管 backend API 存取權限
前期的基礎建設完成後，可以開始廣邀開發成員投入開發。此時不論是前端功能或後端 API 的數量，都會快速成長。前端功能在初期就已經有對應 RBAC 的角色控管，用...
Day18 Vue 共用元件：打造簡易與 Confirm 對話視窗
接下來介紹共用元件（components）的開發，讓不同功能頁面重複使用。先從最簡單的跳窗開始介紹，後續幾天則會帶到進階與更複雜的元件，讓前端 UI 模組更完整...
Day19 Vue 共用元件：Easy Data Table 介紹
介紹完自行開發的元件後，本篇將介紹其他由社群提供的第三方開源套件——Easy Data Table。該元件專為 Vue 3 開發，方便建立資料表格，支援基本的排...
Day20 Vue v-slot 插槽應用
在 Vue 的開發過程中，元件化設計能讓程式碼更好維護與重複使用。不過，光有「元件」還不夠，因為很多時候我們希望在元件裡「保留一個位置」，讓父層可以依照需求去插...