專案名稱：EHS 化學品供應商管理系統 擔任角色： 全端開發工程師 (Full-Stack Engineer) 使用技術： React (Hook/Context), TypeScript, @tanstack/react-query, Java, MySQL/MSSQL, LLM API (Gemini), Material-UI / Bootstrap 專案簡介： 負責打造 / 維護集團內部及供應商使用的核心環境健康安全（EHS）與供應鏈管理平台。系統涵蓋「供應商資料稽核」、「化學物質申請」等高度複雜之商業邏輯，並導入 AI 大語言模型輔助以減少人工作業成本。 核心貢獻與技術亮點： 前端架構設計與狀態管理優化 主導前端技術選型與架構，採用 React + TypeScript 開發。 導入 React Query (@tanstack/react-query) 處理高頻繁的 API 請求與資料快取，大幅減輕伺服器負擔並解決傳統 Redux 狀態管理過於冗餘的問題。 使用 react-hook-form 打造具備自定義驗證的高複雜度表單（如：化學品證號管理、跨表單上傳）。 企業級權限與授權控管 (RBAC) 實作動態路由與權限選單機制，根據後端 Java Spring Boot API 返回之使用者 Token 與權限陣列（CRUD 權限），動態渲染/隔離前端功能模組，保護高度敏感的企業資料。 封裝全域 fetch 與 Axios 請求，統一處理 Token 夾帶、FormData 解析與 HTTP 401 異常自動攔截。 AI 應用賦能 (AI Integration) 將 Gemini 大語言模型 (LLM) 透過 Java 後台服務進行封裝並與前端系統整合，將 AI 功能落地於實際業務場景，提升內部人員操作與資料審核的效率。 資料視覺化與商業邏輯落地 獨立完成「供應商管理」、「化學品申請與商品管理」等核心模組的全端（前後端加上 DB 表結構調整）開發。