前端工程師（Next.js／AI 輔助開發）

關於這個角色

我們正在尋找能獨立開發與維護現代網頁應用的前端工程師，重視效能、SEO、易用性與工程品質。

主要技術組合為 Next.js 與 TypeScript。你會與產品、設計、後端及行銷團隊合作，將產品需求與 Figma 設計轉化為可靠、可正式上線的使用體驗。

我們鼓勵運用 AI 程式開發工具，加速原型製作、功能實作、除錯、重構與程式碼審查。同時，工程師仍須對程式碼品質、架構、安全性與可維護性負責。

你會做什麼

• 使用 Next.js、React 與 TypeScript 開發及維護網頁應用。
• 依據 Figma 設計，製作響應式、具無障礙支援且可正式上線的介面。
• 使用 Material UI（MUI）或 Tailwind CSS，建立及維護可重用的 UI 元件。
• 規劃易於維護的元件結構、狀態管理與前端架構。
• 串接 REST API，處理載入、錯誤、身分驗證與邊界情境。
• 依需求選擇 SSR、SSG、ISR 等 Next.js 渲染策略。
• 實作與維護技術 SEO，改善網站效能及 Core Web Vitals。
• 支援 Google Tag Manager（GTM）與 GA4 的追蹤設定，與行銷、產品團隊共同實作事件及轉換追蹤。
• 使用 Docker／Docker Compose 建立及維護一致的本機開發環境。
• 參與程式碼審查，維護工程標準，並與產品經理、設計師、後端工程師及行銷夥伴協作。
• 運用 AI 工具加速開發，同時維持程式碼品質。

我們期待你

• 熟悉 JavaScript、TypeScript、React 與 Next.js。
• 扎實理解 HTML、CSS 與響應式網頁開發。
• 具備至少一種現代 UI 或樣式方案的使用經驗，例如 MUI 或 Tailwind CSS。
• 能獨立將 Figma 設計實作為可上線的介面。
• 理解可重用元件設計與可維護的前端架構。
• 具備 REST API 串接經驗，熟悉 Git 開發流程。
• 具備技術 SEO 實作經驗，涵蓋 metadata、Open Graph、語意化 HTML、canonical URL、sitemap、robots.txt、結構化資料／Schema Markup、SSR／SSG 的 SEO 考量，以及 Core Web Vitals。
• 具備基礎至中階的 GTM 與 GA4 實作經驗，包含事件、觸發條件、變數及轉換追蹤。
• 有使用 Docker 建立及維護前端開發環境的經驗。
• 能與技術及非技術夥伴清楚溝通。

AI 輔助開發

AI 能加速開發，工程判斷仍由工程師負責。我們重視使用 Cursor、Claude Code、GitHub Copilot、Codex、Windsurf、Gemini CLI 或其他 AI 開發工具的經驗，不要求每一項工具都使用過。

你應能運用 AI 進行以下工作：

• 拆解需求與規劃技術方案。
• 快速製作原型與概念驗證。
• 實作元件及頁面。
• 除錯、重構與產生測試。
• 審查程式碼、撰寫文件，以及理解不熟悉的程式碼庫。

更重要的是，你能評估 AI 產出的程式碼，並對最終實作負責：

• 接受或合併前，先理解程式碼。
• 確認型別安全與錯誤處理。
• 辨識安全性與相依套件風險。
• 避免不必要的套件與過度設計。
• 透過 lint、型別檢查、測試與程式碼審查驗證變更。
• 控制 AI 產生的變更範圍，維持既有程式碼與架構的一致性。

Docker 與開發環境

你應能建立可靠、可重現的本機開發環境，讓開發者快速啟動專案，並在一致的環境中工作。範圍包括：

• Dockerfile 與 Docker Compose。
• Node.js 執行環境與套件管理工具設定。
• 環境變數、本機與開發環境設定。
• 後端及 API 服務串接。
• Volume 掛載與熱更新設定。
• 開發文件與 README。

加分項

• Vue 3、Composition API 或 Nuxt 經驗。
• Google Search Console 經驗。
• Google Ads、Meta Pixel 或其他行銷追蹤平台經驗。
• 伺服器端追蹤經驗。
• Lighthouse 或 PageSpeed Insights 經驗。
• 理解無障礙設計與 WCAG。
• 使用 Vitest、Jest、React Testing Library 或 Playwright 等測試工具的經驗。
• GitHub Actions 或其他 CI/CD 流程經驗。
• 將應用部署至 Vercel、AWS、GCP 或類似平台的經驗。
• MCP、程式開發 Agent、子 Agent 或 Agent 工作流程經驗。
• 建立或維護設計系統與元件庫的經驗。

我們重視的工作方式

• 能獨立將需求或 Figma 設計轉化為可正式上線的功能。
• 關注可維護性、效能、SEO 與使用者體驗。
• 主動辨識技術風險並提出解法。
• 理解何時適合用 AI 加速，以及何時需要工程判斷。
• 審查並驗證 AI 產生的程式碼。
• 清楚說明技術限制與取捨。
• 對交付品質負責。

技術組合

• 前端： Next.js、React、TypeScript、Vue 3。
• 介面與設計： Material UI、Tailwind CSS、Figma。
• SEO 與分析： 技術 SEO、Google Search Console、Google Tag Manager、GA4。
• 開發環境： Docker、Docker Compose、Git、GitHub。
• AI 輔助開發： Cursor、Claude Code、Codex、GitHub Copilot、Gemini CLI 及其他 AI 開發工具。