王教勛

信箱：a596116@gmail.com

居住地：桃園市中壢區

GitHub：https://github.com/a596116

個人簡介

我是一位熱愛技術、擁有高度自我驅動力的前端工程師。

從自學程式開始，便對於「將想法具體實現」充滿熱情，並且在學習與實作中不斷磨練自己的技術能力。

熟悉使用 Vue3、Nuxt3、TypeScript 進行現代化網頁開發，並能靈活運用 SPA 與 SSR 架構，打造高效能且符合 SEO 的網站。

技能樹

前端開發

JavaScript (ES6+)、TypeScript、HTML5、CSS3、SCSS、Sass
Vue3 (Composition API / Options API)、Nuxt3（SSR/SPA 混合開發）
Vue Router 4、Pinia、Vuex
Tailwind CSS、Element Plus、Vant
Vite、Webpack、Rollup（打包與建置）
RWD 響應式設計、SEO 最佳化
頁面效能優化（Lighthouse 指標調教）
前端安全防護（XSS、CSRF 基礎理解與防護）

前端工程化

專案模組化、組件化開發設計
ESLint + Prettier 自動化格式規範
Husky + lint-staged 提交前檢查（Pre-commit hook）
Git Commit Message 標準化（Conventional Commits）
單元測試 (Jest, Vue Test Utils)、E2E 測試 (Cypress)
打包優化（Tree-shaking, Code Splitting, Lazy-loading）
多環境變數管理（dotenv / Vite.env）

後端開發

Node.js、NestJS（架構化開發）
RESTful API 設計與開發
JWT/OAuth2 驗證流程設計
Prisma ORM 操作 MySQL 資料庫
Redis 快取設計
API Error Handling 與 Validation (class-validator, class-transformer)

DevOps 工具與流程

Git（版本控制、Branch管理、Git Flow/Trunk Based）
Docker、Docker Compose、Dockerfile 撰寫
Jenkins：CI/CD 自動化建置與部署流程
Nginx 反向代理（Reverse Proxy）設定
PM2 Node.js 進程管理
GCP 部署經驗
基本 DNS、SSL 憑證設定（Let’s Encrypt）

工作經歷

前端工程師｜尚玄國際股份有限公司

2023/02 — 至今

負責企業 ERP 系統與電商平台的前端開發。

ERP系統模組開發：

進銷存管理：庫存管理、進貨單、銷貨單作業流程設計與串接。
會計系統：對帳明細、沖帳系統、科目管理、帳務報表開發。
人事管理系統：員工資料、出勤記錄、簽核流程
系統架構以 Vue3 + TypeScript + Pinia + Axios 為主，搭配 SCSS 進行樣式管理。
導入模組化開發與元件化設計，提升系統擴充性與維護性。
打包與開發流程使用 Vite 優化，並配置 ESLint + Prettier 保持代碼一致性。
前端資料管理以 Pinia 作為全局狀態管理解決方案，串接 API 進行動態資料渲染與更新。
本地與測試環境使用 Docker 容器化建置，提升團隊開發一致性與環境部署效率。

電商平台開發：

建置前台購物流程、後台商品管理與訂單管理模組，支援購物車、會員中心、訂單系統等功能。
前端技術選用 Nuxt3 + TypeScript + Tailwind CSS，實作高效能且 SEO 友善的 SSR + SPA 混合模式網站。
文章管理系統支援 SEO 優化，使用 Nuxt3 動態生成 meta 資訊（title、description、Open Graph 資料）。
金流串接：綠界，並整合物流配送服務。
響應式設計（RWD）優化，提升多裝置使用體驗。
搭配 Jenkins 自動化部署至 GCP。

作品集

Mini997（外包平台）

Mini997 是一個結合了接案、發案、服務提供與SEO內容佈局的 C2C 外包媒合平台，用戶可以同時扮演「業主」（發案者）與「小人物」（接案者），平台設計以彈性角色、雙向通訊、服務邀約、結案付款為主軸，並結合內容行銷（找故事）強化 SEO，自然提升平台曝光。

Nuxt 3 + Vue 3

採用 Nuxt 3 建構平台，結合 SSR（伺服器端渲染） 與 SPA（單頁應用） 模式，
提升 SEO 收錄表現，強化自然流量來源（尤其針對找故事模組）。
加快首屏載入速度，提升首次互動時間（First Input Delay）。

靜態與動態混合生成

找故事、找服務頁面採用 預渲染（SSG），加速讀取與收錄。

Pinia

使用者登入狀態。
案件列表、案件詳情、服務列表、服務詳情。
邀約報價流程狀態（進行中、完成、取消）。
聊天室訊息流與未讀訊息管理。
支付訂單資料與付款狀態追蹤。

Tailwind CSS

使用 Tailwind CSS 建立一致的設計規範，搭配自訂按鈕、卡片、表單元件。
項目色系、按鈕樣式、字體排版自訂，保持平台品牌一致性。

Loading Skeleton 與預載入動畫

重要頁面（如案件詳情、聊天室）提供骨架屏 (Skeleton Loader)，提升載入體感流暢度。

安心顧365(看護媒合平台)

一個專為家屬與看護設計的 C2C 服務媒合平台，提供雙方能夠方便快速媒合、即時溝通與安排服務的環境。平台致力於解決傳統看護媒合市場流程繁瑣、溝通斷層、資訊不透明等問題，讓需要照護服務的人能夠更快速地找到合適的人選。

採用 Nuxt 3 進行 SSR 加速首屏渲染，提升 SEO 表現與使用者體驗。
採用 Pinia 作為狀態管理，集中管理用戶登入狀態、聊天室訊息、訂單資料等。
使用 Tailwind CSS 打造響應式設計，確保在手機、平板、桌機都有良好體驗。
Vite 作為開發與打包工具，加快開發時的熱更新速度。
即時聊天室功能，讓家屬可以和看護在平台內即時對話、溝通服務細節。
確保訊息即送即達，並支援未讀訊息提示、聊天室歷史紀錄。
整合線上付款，可能串接如 TapPay、藍新金流、綠界科技等服務。

TruthForum(揭弊平台)

一個專注於檢舉事件處理的 B2C 平台，主要提供使用者（大眾）一個可以匿名或具名檢舉案件的窗口，並由公司/單位接收案件後進行調查處理。

在整個處理流程中，平台提供完整的案件追蹤、即時雙向通訊、上傳錄音檔佐證，以及最終案件結案與三方支付功能，確保資訊透明、安全可信。

運用 Nuxt 3 建立 SPA + SSR 混合應用，兼顧 SEO 和互動體驗。
靜態生成部分頁面（如公司介紹、平台公告），動態渲染檢舉案件與聊天室內容。
案件流程、聊天室、錄音管理、支付結算，各功能模組獨立設計。
錄音檔支援直接串流播放，無需完整下載。

自傳

從學習程式的第一天起，我就對「如何把一個想法變成真正能運作的產品」充滿熱情。

在自學過程中，我從基本的 HTML、CSS、JavaScript 開始，逐步掌握 Vue.js、TypeScript 等現代前端技術，並且深入理解 SPA（單頁應用）與 SSR（伺服器端渲染）架構的差異與應用。

在尚玄國際股份有限公司擔任前端工程師期間，我參與了企業 ERP 系統與電商平台的完整開發流程。

ERP 系統涵蓋進銷存、會計、人事管理等模組，這段經歷讓我對企業內部運作流程有了深刻理解，也鍛鍊了我設計資料流與複雜邏輯處理的能力。

電商平台開發則讓我熟悉了商品管理、購物流程、會員中心與金流串接，學會在使用者體驗與後端效能之間取得平衡。

技術之外，我非常重視工程品質與開發流程的優化。

熟悉使用 Git 進行團隊協作，並透過 Docker 容器化、Jenkins 自動化部署，確保開發、測試、上線各階段的穩定性與效率。

未來，我希望能進一步深入大型系統設計、微前端架構（Micro-Frontends）、以及更進階的雲端 DevOps 流程（例如 Kubernetes，Serverless 等技術）。

我相信持續學習與不斷挑戰自我，是成長最重要的動力。