JavaScript 與 React 網頁前端工程實務

JavaScript 與 React 網頁前端工程實務

網頁技術快速的演進,無論是 Webpack 前端專案管理、React 框架、還是即時遊戲互動都成為現代化軟體公司的需求。

為了讓學員們能夠成為獨當一面的前端工程師,本課程將實際帶領大家開發數個具體而微的小型專案,包括以 Webpack 建置現代化前端專案、採用 React 框架開發景點資訊網站、以及採用 HTML 5 / CSS 3 等最新網頁技術開發的小遊戲。

課程大綱

JavaScript 與 React 網頁前端工程,實務課程主題

1. 快速複習 HTML / CSS / JavaScript 技術

2. 使用 Webpack 建置網站專案
2.1 NPM 專案管理工具
2.2 Webpack 基礎觀念
2.3 Webpack 整合 SASS/SCSS
2.4 Webpack 整合 Babel/React
2.5 模組化 RWD 網頁版面開發

3. 使用 React 開發完整景點資訊網站
3.1 建立完整 React 開發環境
3.2 認識 JSX 語法
3.3 React 組件基礎
3.4 React 組件狀態、屬性
3.5 React 組件生命週期
3.6 串接政府公開 API,完成景點資訊網站

4. 網頁遊戲實作入門
4.1 多媒體資料預先載入
4.2 音效播放控制
4.3 影像特效設計
4.4 即時互動的程式設計
4.5 完成一個簡單的遊戲專案

適合對象

具備 HTML / CSS / JavaScript 的基礎能力,或上過 JavaScript 網頁前端工程入門班課程。

開發環境

課程採用 Visual Studio Code 免費開發工具。

近期班次

講師介紹

(1) 國立臺灣大學心理學學士學位、國立臺灣大學資訊工程學碩士學位,具備跨領域專案開發經驗。
(2) 於 2003 年,獲得美商昇陽電腦 Sun Certificated Java Programmer(SCJP) 認證。
(3) 於 2008 年,參與美商昇陽電腦校園大使計畫。
(4) 曾任資策會軟體工程師。
(5) COSCUP 2010 開源人年會講者,講題:Implementation of websocket protocol。
(6) 網頁多人線上遊戲開發。
(7) Piconion 影像處理軟體主要開發者。
(8) iThome Modern Web 2016 講者,講題:Web 終將統治世界,用 JS 打造專業影像處理軟體。
(9) iThome Modern Web 2017 講者,講題:開發複雜網頁應用的黃金法則。
(10) 2008年至本班教學,累計授課時數至2022年6月8日為3410小時。

*老師個人課程網站:https://training.pada-x.com/