訓練日期：2026-09-02上課地點：台北市大安區羅斯福路四段一號國立台灣大學資訊工程學系系館(德田館)上課 …

訓練日期：2026-09-02
上課地點：台北市大安區羅斯福路四段一號國立台灣大學資訊工程學系系館(德田館)
上課費用：6500

課程介紹：

JavaScript 網頁前端工程入門
JavaScript 程式是開發動態網頁應用最關鍵的核心技術，也是學習許多進階技術的重要基礎。藉由 JavaScript 可以設計出高互動性且獨樹一格的網頁、或者未來投入後端開發的領域都不是問題。本課程將從基礎的 HTML、CSS 語法教起，學習靜態 RWD 網頁排版技巧，最終使用 JavaScript 開發能和使用者互動的網頁介面。

本課程搭配 WeHelp 線上程式解題系統，協助大家自主練習解題。

報名此課程

課程內容：

不同於線上課程，此實體課程強調現場的練習指引，當場解決問題。除了知識傳授之外，幫助你熟悉程式語法、掌握運用程式解決問題的能力。課堂上，我們會花將近一半的時間，安排將近 20 個精心設計的小型作業，並搭配 WeHelp 線上程式解題系統，協助大家自主練習解題，進而真正學會寫程式這件事情。

JavaScript 網頁前端工程入門課程主題：

1. 課程簡介

2. HTML、CSS 靜態網頁基礎
2-1. HTML 基礎
2-2. CSS 基礎
2-3. CSS 區塊模型、選擇器
2-4. Flexbox 網頁切版
2-5. 網頁排版現場演練

3. JavaScript 前端程式，語言入門
3-1. JavaScript 簡介
3-2. 資料、資料型態
3-3. 變數、運算符號
3-4. 入門技巧題目現場演練

4. JavaScript 前端程式，語言核心
4-1. 流程控制：判斷式
4-2. 流程控制：迴圈
4-3. 函式基礎
4-4. 物件基礎
4-5. 核心技巧題目現場演練

5. JavaScript 網頁動態效果
5-1. HTML DOM
5-2. 事件處理
5-3. HTTP 通訊協定
5-4. AJAX/XHR 前後端互動
5-5. 動態網頁效果題目現場演練

師資介紹：

彭兆蔚(彭彭) (1) 國立臺灣大學心理學學士、國立臺灣大學資訊工程學碩士，跨領域專案開發經驗。
(2) 於 2003 年，獲得美商昇陽電腦 Sun Certificated Java Programmer(SCJP) 認證。
(3) 於 2008 年，參與美商昇陽電腦校園大使計畫。
(4) 資策會軟體工程師、Tomofun 網站工程師。
(5) WeHelp 深度學習、網站開發職業訓練導師與創辦人。
(6) COSCUP 2010 開源人年會講者，講題：Implementation of Websocket Protocol。
(7) Piconion 影像處理軟體主要開發者。
(8) iThome Modern Web 2016 講者，講題：Web 終將統治世界，用 JS 打造專業影像處理軟體。
(9) iThome Modern Web 2017 講者，講題：開發複雜網頁應用的黃金法則。
(10) iThome Modern Web 2018 講者，講題：網頁前端在人工智慧的應用。
(11) 2008 年至本班教學，累計授課時數至 2025 年 4 月 16 日為 4,550 小時，為資深講師。老師的個人課程網站：https://training.pada-x.com/

備註：
詳細內容及報名需知，請點選報名後見協會網站內容

報名此課程

[elementor-template id="128291"]

這篇文章 【9/2 台北場】JavaScript 網頁前端工程入門-國立台灣大學資訊工程學系 最早出現於 科技島-掌握科技新聞、科技職場最新資訊。

訓練日期：隨時開課上課地點：台北市松山區復興北路99號14樓上課費用：線上洽詢 課程介紹：   前端的設計人員 …

訓練日期：隨時開課
上課地點：台北市松山區復興北路99號14樓
上課費用：線上洽詢

課程介紹：

前端的設計人員必須能夠善加利用HTML與CSS才能夠盡善盡美，而HTML5引入了一個重要的部分。便是語意的標籤，這使得現代網頁的結構更加完整，而撰寫與維護網頁時的閱讀也更為清晰。

本課程將逐一的引導學員由熟悉HTML基礎標籤，一直延伸到HTML 5的語意標籤。

接著會探討基礎CSS的各種基本選取與設定，並且搭配CSS 3新增的各項功能，如強大的選取器，彈性的排版方式，多變化的漸層色彩，與各式動畫效果等。

並且會說明如何以媒體查詢的功能達成響應式網頁(RWD：Responsive Web Design)的設計。最後透過JavaScript的控制能力，來實現一些網頁上常見的功能。

報名此課程

課程內容：

 1.    HTML 文件結構
2.    HTML 常用與語意標籤
3.    圖片、表格與超連結標籤
4.    表單的建立
5.    影音多媒體標籤
6.    CSS 基本語法
7.    CSS 選取方式介紹
8.    色彩與文字設定
9.    寬度與高度屬性
10.    CSS 外框模型
11.    背景與漸層屬性
12.    定位方式與版面設定
13.    媒體查詢
14.    Flex 彈性排版效果
15.    響應式網頁設計
16.    變形與動畫效果
17.    JavaScript語法簡介
18.    以JavaScript設定簡易互動效果

備註：
詳細內容及報名需知，請點選報名後見協會網站內容

報名此課程

[elementor-template id="128291"]

這篇文章 【台北場】FEDev 前端必學的網頁開發基礎技能- 恆逸教育訓練中心 最早出現於 科技島-掌握科技新聞、科技職場最新資訊。

開發者Rebane發布一個專案，完全不用Javascript或WASM，只用CSS寫出x86CPU模擬器。模擬器具備顯示器與鍵盤，預載費氏數列(Fibonacci sequence)、巴斯卡三角形(Pascal's triangle)與Wordle變體程式。因為用到非標準CSS功能，要用近期版本Chromium架構瀏覽器才能跑。

記者鄧天心／綜合報導

開發者Rebane僅利用網頁排版工具CSS，就打造出一台能在網頁運作的虛擬電腦(x86CPU模擬器)，過程未使用Javascript或WASM等負責邏輯運算的語言，這台虛擬電腦內建螢幕與鍵盤功能，並預載數學計算與猜字遊戲Wordle，使用者只需透過近期更新的Chrome等Chromium架構瀏覽器就能直接開啟執行。

[caption id="attachment_207895" align="aligncenter" width="900"] CSS不只能排版，開發者做出x86CPU模擬器。（圖／AI生成）[/caption]

至於這台虛擬電腦能不能玩遊戲Doom，開發者表示目前還無法，雖然x86css模擬器能看懂基礎電腦指令，卻缺乏處理突發狀況與外部資料進出等核心機制，但Doom需要32位元CPU規格與4MB記憶體空間，目前這套工具規格未達標，不過Rebane提供教學，指導大家將C語言轉換成這台虛擬電腦能看懂的格式來執行。

Rebane強調開發過程沒有使用AI工具。這個排版工具CSS擁有記憶與運作狀態(state machine)功能需要跳脫常規邏輯，這點AI做不到。

更多科技工作請上科技專區：https://techplus.1111.com.tw/

此構想來自另一名開發者Jane Ori的CSS CPU Hack專案，不過也有外界質疑這項技術會不會變成駭客攻擊管道(attack vector)，因為必須自行建置運作環境，但這個成果也讓大眾重新思考網頁排版工具HTML與CSS作為程式語言的用處。

延伸閱讀：

Read AI推出郵件AI助手Ada 自動安排會議與回覆郵件

資料來源：tomshardware

這篇文章 不用JavaScript與WASM！有開發者僅用CSS 竟能跑虛擬電腦 最早出現於 科技島-掌握科技新聞、科技職場最新資訊。

這次我們走進1111人力銀行，採訪技術中心的技術長許永昌，請他聊聊對於新鮮人或想要轉職進入科技產業成為前端工程師的人所需具備的條件和技能？

記者／鄧天心

據2024年4月針對科技產業的調查顯示，理工人才的需求已經開始擴展至周邊系所，數學和統計學相關背景的人才愈發受到重視，相關技能已成為求職市場上的熱門資產。此外，非理工相關背景的學生也顯示出了跨領域學習數據分析、機器學習以及程式語言的意願。同時，非科技產業從業人員也對轉往科技領域抱有期待，希望能夠獲得更豐厚的薪酬和更多的職業發展機會。

這次我們邀請1111人力銀行技術中心的技術長許永昌，請他聊聊，對於新鮮人或想要轉職進入科技產業成為「前端工程師」的人，需要具備哪些條件和技能？

延伸閱讀：【學長姊帶路】從供應鏈轉職 UI/UX 再到產品經理

成為前端工程師的路上，哪些是新手會忽略的重要知識？

前端工程師不僅要會編寫程式碼，更是扮演著溝通橋樑和前線作戰的雙重角色。前端工程師需要理解網頁設計師提供的UI/UX框架，將設計理念轉化成網頁，同時也需要與後端工程師密切合作，串連資料庫，確保網站的整體運作流暢，提供最好的使用體驗。

許永昌認為，在新手成為前端工程師的路上，最需要具備的三大元素，就是熟悉超文本標記語言HTML、層疊樣式表CSS，及程式語言JavaScrip，而他濃縮了25年來擔任工程師主管的經驗，直切新人最容易踩的誤區，幫助新人快速掌握學習重點。

首先，構建網頁的基礎框架HTML，關乎著網站的可讀性、搜索引擎排名等因素，但許永昌提到，不少人在學習HTML時，往往忽略了搜索引擎優化（SEO）的概念，甚至連有多年工作經驗的工程師都不一定熟悉相關基本原則，對於HTML標籤的誤用，他舉例「例如semantic tags的使用時機例如跟內容無關的廣告，就會使用aside的標籤來處理，以及對H1和H2標題的忽略等等。」並表示這些標籤主要的目的都是為了讓搜尋的爬蟲更容易理解整個內容的意圖，提高在搜尋頁面的自然排行。

第二個，前端工程師需要具備的概念「CSS」，這關乎網站整體的外觀，也影響到用戶對網站的感受和體驗。許永昌認為，新手上路，最重要的就是熟悉支援RWD的CSS框架，如Bootstrap、Tailwind和Mastercss等，這些CSS框架提供了豐富的動畫效果和樣式，熟練之後將大大提高網頁切版的效率及未來維護的方便性。 

最後，談到前端工程師最重要的核心技術：JavaScript，主要負責網頁的互動效果及後端API的串接，除了熟悉市場上常用的JQuery對DOM的操作外，另外要再學習Javascript前端框架，而目前市場上的三大前端框架的主流分別是Vue、Angular及React，這三個框架各有優缺點，新手在選擇要學習哪個框架時，建議可以透過1111人力銀行來搜尋「前端工程師」的關鍵字，了解目前台灣職場上的主流框架，再進行挑選，許永昌另外表示「當然若時間允許，三個框架都能學習起來，相信職涯的領域就更加寬廣。」

不要埋首讀書而已！從「夢幻職缺條件」找到你的學習路徑

除了埋首學習技術及基礎概念之外，許永昌也建議，新手可以在Github上，將一些大神的專案源始碼載下來，學習這些大神開發的方式，或是加入技術社群或社團如Stack Overflow、Discord、Facebook社團⋯⋯等，隨時獲取最新的資訊以及問題的解決方案。這些都有助於前端工程師技術功力大增的管道。

在掌握了市場需求和技術趨勢後，許永昌提到，如果新人若能在面試前做足準備功課，對於即將面試公司及其競業所使用到的前端技術進行整理或實做，在面試時能提出相對應見解及解決方案，都會讓面試官對新人印象深刻。

非理工背景反而更有優勢？

不少非科技相關產業的從業人員，可能擔心轉職成為前端工程師門檻高，然許永昌則認為，沒有理工背景的人如果善用現代科技跟創新工具，像是生成式AI平台：ChatGPT、Copilot、Gemini⋯⋯等，嘗試將自己的程式碼進行優化，也能提升開發能力及加速專案開發速度。

此外，如果若擁有其他專業背景，例如會計系或經濟系，也可以借助原有的專業知識優勢來轉職成為前端工程師，例如，會計系背景的人可能對於財務系統的開發更加熟練，擁有豐富的Know-how。同時，對於資料科學領域有興趣的人，經濟系或統計系背景也能夠為他們提供優勢，「因為已經熟悉自己領域的相關知識，並且能夠自己寫程式，相對比起理工本科系的人更具開發上的優勢。」許永昌解釋。

許永昌指出，無論是新鮮人踏入職場還是準備轉職成為前端工程師，他們在學習的過程中都會遇到各種挑戰。然而，他強調這些挑戰都是非常值得的經歷。現今網路上的資源豐富，相較於30年前，前端工程師有了更多學習的管道，不再僅侷限於學院的完整課程，現在有許多不同的學習路徑可供選擇。例如，線上課程平台如Udemy和Coursera提供了豐富的影片教學資源，而Medium平台上也有許多實戰經驗分享，他有信心地表示，「只要透過不斷地累積實戰經驗並持續學習，相信每個人都能夠走上成為一名優秀前端工程師的道路！」

想了解更多的科技業職缺嗎？由科技島與1111人力銀行攜手合作、透視上百種科技工作內容與薪資行情的「職缺百科」正等著您前往探索！

這篇文章 邁向前端工程師　新手或轉職必備的相關技能 最早出現於 科技島-掌握科技新聞、科技職場最新資訊。