核心前端技術
React / Next.js
用於作品集頁面、App Router 版面與可重用頁面區塊。
- 以元件化方式拆分作品集區塊，讓每個區塊責任清楚。
- 使用 Next.js App Router 組合頁面結構與部署流程。
- 把專案敘事和可維護的 React 結構連在一起。
技能 // 面試證據
用專案成果證明技能
能力不靠百分比說明，而是透過已完成的頁面區塊、型別化資料、API 流程、驗證習慣與可維護的實作選擇來呈現。
可維護性
TypeScript
用於型別化專案資料、元件 props 與前端資料契約。
- 用明確型別描述專案內容與共用資料結構。
- 讓作品集資料在區塊調整時仍維持可預測。
- 把資料形狀寫清楚，降低 review 與維護成本。
UI 實作
樣式系統
使用 Tailwind CSS、styled-components、SCSS 與響應式版面。
- 把視覺方向轉成可重用、可響應的 UI 區塊。
- 在不同斷點維持深色、高對比的作品集風格。
- 優先沿用既有樣式做法，不額外加入 UI library。
產品流程
API 整合
用於天氣資料、後端 API 流程與 Supabase 資料串接。
- 把前端畫面接到真實 API 驅動的專案案例。
- 在需要時處理使用者看得到的 loading、empty、error state。
- 讓資料整合集中在目標功能流程，避免擴散到無關區塊。
品質訊號
測試 / 驗證
使用 lint、build、聚焦 UI 驗證與可 review 的 diff。
- 在送出實作 PR 前執行 repo 檢查。
- 用聚焦驗證取代大範圍、無關的重寫。
- 把變更維持在 code review 能有效檢查的大小。
系統思維
前端架構
用於功能邊界、資料模組與頁面層級組合。
- 在有實際幫助時拆分頁面區塊、資料與共用型別。
- 避免沒有必要的抽象，等它能降低複雜度時才加入。
- 優先維持清楚結構，方便後續維護與交接。
Career Timeline
從測試思維到前端開發的實作累積。
LAP 2022 - 2023
自我實踐與技術啟蒙
@ 學習與個人專案
- /建立 HTML5、CSS3 與 JavaScript (ES6+) 基礎，理解網頁結構、樣式與互動邏輯。
- /完成多個 Side Projects，練習響應式版面、資料呈現與基本使用流程設計。
- /開始使用 React，熟悉元件拆分、props 傳遞與狀態管理的開發模式。
LAP 2023 - 2024
測試工程師
@ 緲思網路科技有限公司
- 負責產品手動測試與 Bug 追蹤，培養對介面細節、流程斷點與使用情境的敏感度。
- 與前端團隊協作回報可重現問題，提供具體畫面、步驟與改善建議。
- 使用 XMind 規劃測試流程與問題脈絡，提升需求理解與跨部門溝通效率。
- 持續進修 HTML、CSS、JavaScript 與 React，將測試視角轉化為前端開發判斷。
LAP 2025 - PRESENT
前端工程師
@ 伊利諾芝加哥教育股份公司
- /參與官方網站建置與優化，改善 SEO 表現、LCP 載入速度與主要頁面可讀性。
- /開發並維護內部 UI 元件，兼顧互動效果、可重用性與無障礙細節。
- /整理前端開發流程與維護規範，協助提升專案穩定性與後續交接效率。
精選專案作品
以 React / Next.js 前端實作為主，整理需求拆解、介面互動與資料串接的實作案例。
Contact / Hiring
讓作品成為下一次面試的起跑點
如果你正在尋找前端工程師，這裡提供目前可驗證的聯絡入口。歡迎透過 Email 安排面試，也可以先從 GitHub 檢視實作方式與專案脈絡。