黃玟翔

Frontend Developer  •  定瀛傳媒

七月 2023 - 九月 2024

1. 開發一套社交應用程式：讓用戶能夠註冊個人檔案、追蹤、訂閱、新建個人頻道、發佈文章/主題、上傳影片、依使用者喜好更新標籤、歷史紀錄、我的最愛、留言、提領分紅功能、查看收益、推廣、搜尋、等功能。
2. 開發後台系統：讓管理者能夠通過後台系統快速了解並操作數據。
3. 跨平台及瀏覽器測試：盡早開始在不同的瀏覽器和設備上進行測試，尤其針對Chrome、Safari、百度等。使用模擬機來模擬多種平台和瀏覽器，確保一致性。
4. 串接工具：使用Azure wiki、swagger、postman及axios結合 RESTful API 設計串接後端 API，取得資料及資料顯示、包含分頁、資料驗證等
5. 性能優化：圖片懶加載：懶加載圖片，減少流量消耗。API 請求重試機制：對於不穩定的網絡連接，可以實現 API 請求的自動重試機制，結合 Axios 的 interceptor，防止因短暫網路錯誤導致的應用程式崩潰。資料暫存：使用 IndexedDB 或者 localStorage 來暫存大批量的圖片、影片和用戶資料，減少不必要的 API 請求，尤其是在離線模式下提升用戶體驗。
6. JWT 安全性：在進行 JWT 認證時，可以設置合理的 Token 有效期，並且定期刷新 Token，防止長時間的會話導致潛在的安全風險。
7. 手勢與觸控優化：針對手機端的手勢操作，如拖拽、滑動切換頁面等，自行建構程式架構，來確保跨平台的手勢體驗。
金流安全性：針對金流串接，確保支付邏輯安全。針對敏感數據的處理，像分紅或訂閱須嚴格驗證避免不正當支付或失敗。
動畫與效能平衡：動態效果應在保持效能的前提下進行。CSS 動畫相對於 JavaScript 動畫會更有效率，尤其在手機和低配置設備上更能保證流暢度。
8. 元件重用性：確保自建像按鈕、表單、彈窗等常用的 UI 元件具有高重用性，減少重複程式碼，並且更容易維護。
9. 函數重用性：使用composable來重複使用，減少重複程式碼，並且更容易維護。
10. 防禦性編程：使用TypeScript執行類型辨別，JSDoc執行註解使程式更容易維護。
11. 狀態管理：對於應用中的全域狀態，如用戶資料、認證狀態、以及頻道、文章等核心功能，使用Pinia 來集中管理狀態，避免層層傳遞 Props，並方便處理全域數據更新。
12. 持續優化的過程中，保持定期版本更新與測試，會確保應用在不同階段都能夠運行穩定並提供良好的用戶體驗。