教育訓練期間

教育訓練

在正式參與部門工作之前,公司安排三階段教育訓練,涵蓋前端框架、資料庫查詢與現代化 Web 技術,協助實習生快速銜接職場所需的技術能力。

OVERVIEW

訓練概覽

教育訓練採自學影片為主、輔以練習作業的方式進行,每個階段皆由部門學長提供規格書與練習題目,完成後進行 Code Review,確保學習成效符合實務需求。訓練內容循序漸進,從前端框架到資料庫操作,最終延伸至現代 React 生態系,兼顧廣度與深度。

一月至二月
Angular 教育訓練 與練習專案
透過影片自學 Angular 框架核心概念,並依照部門學長提供的規格書完成多項練習作業,包含 CRUD 操作、CSV 匯入匯出與電文呼叫等功能實作,最後進行 Code Review。
二月初
SQL 資料庫練習
學習企業實務中常用的 SQL 查詢技巧,練習條件篩選、排序、JOIN 等操作,並完成部門提供的實際練習題,體會學校課程與業界應用之間的差異。
三月
React 教育訓練
進入 React 生態系,學習 state/props 資料流、事件處理、元件生命週期等核心概念,完成陣列操作、表單驗證、互動視窗等練習,並善用 DevTools 進行除錯。
STAGE 01

Angular 教育訓練與練習專案

以影片自學為主,搭配部門規格書進行系統性的前端框架訓練,奠定企業級應用開發基礎。

學習內容

本階段透過系統化影片課程深入學習 Angular 框架,涵蓋專案結構規劃、TypeScript 型別系統應用、元件(Component)架構設計,以及資料繫結(Data Binding)與事件處理(Event Handling)等核心機制。透過實作練習,建立對 Angular 單頁應用程式(SPA)開發流程的完整認識,並熟悉企業團隊慣用的程式碼風格與命名規範。

Angular TypeScript HackMD

練習作業

依照部門學長提供的規格書完成多項功能模組開發,包含資料的新增、刪除、修改、查詢(CRUD)操作介面設計,CSV 檔案的匯入與匯出功能,以及電文呼叫(API 串接)等實務場景。每項作業完成後均進行 Code Review,由學長針對程式邏輯、可讀性與效能提出具體建議,協助建立正確的工程思維。

CRUD 操作
新增 · 刪除 · 修改 · 查詢功能完整實作,包含表單驗證與資料驗證邏輯。
CSV 匯入/匯出
實作檔案上傳解析與資料匯出下載,處理常見的編碼與欄位格式問題。
電文呼叫(API)
串接後端 API 進行資料交換,理解 HTTP 請求週期與錯誤處理機制。
Code Review
由學長逐項審查程式碼,給予改善建議,培養工程師協作與自我審查能力。
📋 Angular 教育訓練作業畫面
📋 規格書練習作業
STAGE 02

SQL 資料庫練習

以實際部門練習題為素材,學習企業環境中常見但學校課程較少涉及的進階查詢技巧。

學習內容

本階段聚焦於 SQL Server 的實務應用,從基礎查詢語法出發,逐步深入條件篩選(WHERE)、資料排序(ORDER BY)、多資料表合併(JOIN)等操作,並延伸至企業環境中常見但學校課程較少涵蓋的進階查詢模式。透過實際練習,體會資料庫查詢效能的重要性,以及如何選擇合適的查詢方式以符合業務需求。

SQL Server

練習成果

使用部門提供的真實練習題進行訓練,針對同一查詢需求比較多種不同的實作方式,深入理解各種查詢策略的適用情境與效能差異。透過比對學校所學與業界實務的落差,建立更貼近真實工作環境的資料庫操作思維,並累積解決複雜查詢問題的實戰經驗。

🗄️ SQL 練習畫面
STAGE 03

React 教育訓練

延伸前端學習歷程,進入 React 生態系,掌握現代化元件化開發思維與資料驅動介面設計。

學習內容

本階段學習 React 的核心開發概念,理解 state 與 props 的資料流動機制、事件處理方式,以及元件生命週期的運作原理。相較於傳統的 HTML/JavaScript 開發模式,React 的宣告式(Declarative)設計哲學與元件化架構帶來截然不同的開發體驗。課程強調釐清兩種開發範式之間的思維差異,建立正確的 React 心智模型。

React TypeScript

練習成果

完成多項實務練習,包含陣列資料的渲染與操作(新增、刪除、過濾)、表單驗證邏輯實作、互動視窗(Popup/Modal)的顯示控制,以及善用瀏覽器 DevTools 進行元件狀態檢查與效能分析。透過反覆練習,熟悉 React 開發流程,為後續正式參與部門專案做好準備。

陣列操作
資料列表渲染、新增刪除過濾,理解 React 的不可變資料更新模式。
表單驗證
受控元件設計、輸入驗證規則,以及錯誤訊息的即時反饋機制。
Popup/Modal
互動視窗的開關控制,使用 state 管理 UI 顯示邏輯。
DevTools
使用 React DevTools 檢查元件樹與狀態,提升除錯效率。
⚛️ React 教育訓練畫面