Loading...

框架是工程師必備的開發工具,而 React 則是現在最多人使用的前端框架。市場對 React 工程師需求旺盛,給薪也較高。想爭取好的前端工程師工作機會、提升薪資競爭力,你絕對不能錯過 React。然而,前端學習要進階到框架,卻令人卻步。而成為業界人才,除了技術,還要準備什麼?要有什麼基礎,才能更順利展開學習?又如何更有效地學會呢?

React 熱門,業界需要 React 工程師

State of JS 2021 這份軟體工程師必看的 JavaScript 年度趨勢報告中,可以看到從 2016 年起,React 一直都是最熱門的前端框架。

source: State of JS 2021

接著我們再搜尋求職網站,看看市場對 React 工程師的需求。在 CakeResume、104 人力銀行上,可以搜尋到近 300 筆需要 React 的 Junior 工程師職缺。其中,不乏來自大公司與外商,而薪資則落在 60 - 100 萬年薪之間。

source: CakeResume,搜尋時間 2022/8/18
source: 104,260 筆職缺。搜尋時間 2022/8/18

軟體工程師養成,申請 5 天免費試讀

學習 React,要有什麼先決條件?

資深前端工程師 Yuri 說明一是要有紮實的 JS 基礎,其中也會用到許多 ES6 的語法。簡單來說,可以是看完一本 JS 核心語法的書,或是完成一門系統化的課程所謂紮實的 JS 基礎,大致包含以下:

  1. 熟悉 HTML & CSS 基礎語法,並至少要能夠使用 Bootstrap 組裝出一頁式網站
  2. 熟悉 JavaScript 基礎語法,包括
  • DOM
  • 事件處理
  • 函式封裝與調用
  • 陣列操作語法
  • 要有 ES6 module 的概念 (import & export)
  • JS 非同步 (Promise, Async / Await),打 API 會用到
  1. 有網際網路的基礎觀念,包括HTTP 的請求與回應、網路資源和 URL 之間的對應關係
  2. 知道什麼是 MVC 程式架構、RESTful API 設計風格
  3. 會終端機的基本操作語法,例如檔案建立或在資料夾之間切換移動

轉職前端工程師:10 個業界求生指南

React 要學到怎樣的程度?

這邊幫大家定義入門 React 必學的範疇,包含:

  1. 知道什麼是前端框架
  • 前端工程師在開發中扮演的角色與關注的重點
  • 什麼是前端框架,並且知道前端框架在解決什麼問題
  • Single Page Application
  1. 能夠建立 React 專案
  • 本地環境建置
  • 線上環境建議 (eg. CodeSandbox)
  1. 知道什麼是 Virtual Dom 和 React Elements,並且能夠建立 React Elements,也會使用 JSX 語法糖
  2. 熟悉基本的 React 框架操作,並且有資料流的觀念,能夠建立元件並傳遞資料
  • Component & Props
  • State & Reconciliation
  • Component 的生命週期 & Effect
  • Refs
  1. 掌握 React 基礎實戰技巧,能用 React.js 做到:
  • 事件處理
  • 表單處理
  • 呼叫、串接後端 API
  • Routing
  • 狀態管理
  1. React Hooks
  • 認識 React Hooks 的原理與想解決的問題
  • 能夠使用基本用法如 useState、useEffect
  1. React Context

也建議大家,從官方文件學習。官方文件是工程師共同技術文件的來源、一份規範,是為沒用過的人設計,更有友善新手的內容。以下也提供一些 React 的學習資源:

學會框架後,如何成為業界要的工程師?

學完前端框架,你不會馬上就變成工程師。還要建立、累積工程師思維與習慣,更要有開發工作的軟實力。

動手、也要動腦,養成思考的習慣:技術學習上,我們時常比較關注在動手,也就是會不會做、做不做的出來。但比較容易忽略動腦,像思考技術使用時的 why 與 How,例如:這個技術是想解決什麼問題?技術背後的設計邏輯是怎樣?所以在學習中,要刻意練習、養成思考的習慣,這能更加深學習的效果。

主動尋找更多技術應用情境:學習框架是為了成為軟體工程師,解決真實世界的商業問題。所以養成思考習慣後,可以開始找更多情境,來刻意練習技術使用。透過課程作業的練習、做 Side Project,都是很好的方式。

培養軟實力:由於軟體開發是團隊工作,所以要成為業界要的工程師,技術之外,還需要團隊協作、溝通、解決問題等軟實力。從企業雇主角度來看,會希望能找到怎樣的工程師呢?

跨國企業 foodpanda 的 Engineer team lead 說:

  • 「工程師除了技術,還要能持續學習、精進專業」
  • 「成為獨當一面工程師的關鍵心態,是能解決問題」

台灣區塊鏈新創獨角獸奧丁丁 Engineer Team Lead 則說:

  • 「在像區塊鏈這樣變動快速的產業,工程師要能不斷學習,主動找出問題、提出解決方案。」
  • 「而在團隊中,溝通、使用者思維、開放學習等軟實力,都不可或缺。」

前端工程師要會什麼?工作上會遇到什麼挑戰

AC 全端網頁開發課程,怎麼幫你?

學習 React、準備成為工程師時期的學習挑戰,是從被動吸收理論知識,到能帶著問題意識、主動尋找解決方法,並適應真實 open source 世界。例如,你開始能夠從官方文件找答案,就可能會遇到自己基礎學習不足、需要再填補、主動再找資源學習的地方。

ALPHA Camp 全端網頁開發課程,以兩個方向來幫助你起步與踏入 React 工程師的世界。

React 框架課程:學期三:軟體工程師養成的前端班,與有 10 年授課經驗的奶綠茶老師合作「React 前端框架課程」,利用官方文件導讀,帶同學快速掌握 React 核心;以 exit ticket,驗收技術學習中較抽象的思考,幫助同學建立思考的習慣;提供大量情境練習題,幫助同學刻意練習在不同場景應用技術的能力。

工程師養成資源:課程安排「團隊專案」小組協作,幫助同學在模擬情境中,參與開發工作、建立產品思維。而學習社群不定期舉辦 Side Project 活動,也幫同學有更多應用技術的機會、甚至提早準備作品集。

成為專業開發者,放大 10 倍程式實戰力,馬上申請獎學金計畫