iThome鐵人賽
含有「iThome鐵人賽」共 22 篇內容
全部內容
發佈日期由新至舊
這是我第一次參加 iThome 鐵人賽，原本並沒有打算參加，但在整理專案時，我忽然想把屬於自己的內容公開分享，而不僅僅藏在雲端裡。於是，我獨自規劃、撰寫並完成了一個完整的開發系列文章。在這段過程中，我體會到獨自開發的挑戰與成就，並希望能將這些經驗分享給每一位正在努力前行的你。
這篇文章介紹建立分類列表頁面以及新增和編輯功能。文中詳細說明瞭頁面結構、資料取得、錯誤處理等重要步驟，並強調了共用元件和資料驗證的一致性。通過這次開發，讀者將獲得關於如何在Nuxt中操作動態路由的深入理解，同時提高使用者體驗。希望本篇能幫助讀者順利完成相關功能建置。
哈囉，大家好！在前面的文章中，我們已經規劃了前端介面，並盤點了所需的頁面與功能。
現在，是時候開始動手實作了。今天，我們將專注於 銀行帳戶列表頁面（Bank Accounts）以及 新增/編輯銀行帳戶頁面（Add/Edit Bank Account）的開發。
透過這次的實作，我們將學習如何在 N
哈囉，大家好！本文探討了 Nuxt 前端介面設計與規劃，為個人財務管理系統建立頁面清單及功能需求。從首頁、交易紀錄到報表頁面，每個頁面皆包含具體操作和資料顯示功能。透過重新盤點與規劃，提升開發效率、使用者體驗及協作效果，為後續開發奠定基礎。
哈囉，大家好！本次介紹如何在 Nuxt 應用中使用 Axios 整合 Laravel 後端 API，實現動態資料渲染並搭建身份驗證機制。透過 Axios 配置與 Vuex 狀態管理，建立交易紀錄頁面並添加錯誤處理，提供更友善的使用者體驗。
哈囉，大家好！我們將探討 Nuxt 開發環境的建立與應用介面規劃，通過使用 Nuxt 的約定式結構和全域佈局，我們更高效地管理前端界面，並設計了首頁、交易紀錄、銀行帳戶等頁面。未來計畫包括整合後端 API、身份驗證及介面優化。
完成後端基本功能並通過驗收後，我們開始使用 Nuxt 架設個人財務管理系統的前端。Nuxt 基於 Vue，學習曲線平緩且配置簡單，適合不同程度的開發者。透過 Docker，我們快速建立了 Nuxt 開發環境，並搭建首頁和交易紀錄頁面，整合 Tailwind CSS 提供美觀的 UI。
我們已完成個人財務管理系統的後端核心功能，並進行了中期驗收，確認API的正確性和需求的達成。通過Postman測試各個API並檢查資料驗證，確保後續的前端整合能順利進行。接下來，將實作身份驗證機制並開始Nuxt.js前端開發，提升系統的整體品質與安全性。
單元測試為重構提供了安全防線，確保程式碼在修改後仍能正常運作。透過撰寫測試，我們能夠提高程式碼品質、預防回歸錯誤，並在重構過程中更具信心。測試的過程不僅幫助找出錯誤，也促使我們深入思考系統設計，從而優化整體架構。
其實寫程式不難，難在驗證這個程式的正確與否。功力好的調一兩次，功力差的花一禮拜還沒搞定。
單元測試不僅能發現錯誤，更是提升開發技能的關鍵工具。Laravel 提供強大的測試框架，讓我們可以輕鬆撰寫測試。建立測試資料庫、撰寫測試方法、使用 Factory 生成測試資料，能確保程式碼穩定，並幫助開發者在修改與重構中更有信心。持續撰寫測試能提高程式碼品質，並讓開發過程更有條理與安全感。
