自從網際網路於 1980 年代出現後，不到五十年的期間，「上網」已經變成了生活中的一種基礎活動，無論是網路購物、資訊搜尋、線上社交等，現代人（尤其是都市人）的生活已經越來越依賴網路，以及根基於網路所發展出的軟體。最好的證明就是 Apple, Microsoft, Google, Amazon, Facebook, 騰訊這些名列全球市值前十大的公司，其核心業務都是環繞著網路與軟體。
而本文要介紹的，就是在這樣的世界下所形塑的一個新興職業類別：「前端工程師」。
攻略大綱
· 什麼是前端工程師 ┃ 傳送門
· 市場趨勢 ┃ 傳送門
· 工作內容 ┃ 傳送門
· 人格特質 ┃ 傳送門
什麼是前端工程師
前端工程師是讓你有地方「上網」的小精靈。
再詳細一點說明，我們一般講的「上網」泛指各種連結到網路後所進行的活動，包含了瀏覽器，或者手機或桌機的應用程式。這其中，應用程式通常都有一個明確的目的性，手機的 FB 應用程式不可能拿來傳 LINE，反之亦然。但只要開啟瀏覽器，只要有個網址，你就可以到達各種網站，進行各式各樣的線上活動（根據統計，目前世界上有 17 億以上的網站）。
您現在所在的這篇 Yourator 專欄文章也是一個網頁，就是前端工程師的傑作。舉凡所有需要在瀏覽器內呈現的、運作的（通稱網頁），都屬於前端範圍，而前端工程師就是把這樣的系統建造出來的人。有了前端工程師，我們才有網頁可以看，或者換句話說，才有辦法在網頁上進行線上活動。
市場趨勢
更深入了解前端工程師之前，我們先從市場發展的趨勢來看看這個熱門的職業類別。
軟體是現下最熱門的主流產業，從下圖可以看到軟體的整體市場未來五年預測成長率高達 45%，這代表著軟體工程師有著較高的就業機會、以及相對高的待遇水準，是近年來頗受青睞的職業類型。
資料來源：statista
前端工程師的部分，根據 Yourator 平台的統計，平均年薪落在 NT$ 1,100,000 左右，下圖呈現出不同級別前端工程師的待遇。值得一提的是從初階（入門）到平均、資深，每個階段都有不小的成長幅度。
Yourator 平台統計 - 前端工程師年薪分佈
若想了解全球的趨勢，可以參考 Stackoverflow 的調查報吿 ，或是在 levels.fyi 查詢各國軟體工程師的待遇水平。從 Stackoverflow 的調查報告可以知道，前端工程師的薪資在各種不同工程師的類別中並不突出，但相較於其他職種，其待遇仍然很有吸引力，加上進入門檻較低，因此可說是轉職跨入軟體工程領域的首選。
接下來，我們來瞭解一下前端工程師都在做什麼、需要怎麼樣的人格特質。
工作內容
只要是在網頁上發生的，就與前端有關係，大略可以歸納為以下幾個大項目：
從設計轉化為真實網頁
身為前端工程師，你會從設計師端得到設計稿，並且運用你的技術把設計轉換為網頁。這包含了頁面的排版、各種互動式元件比如下拉式選單、對話框等等、以及與設計稿盡可能相符的外觀、動畫。在這過程中，設計行為不可能每次都與實作行為相符，或是會出現現有資源下無法實作的狀況，這時就需要與設計一同討論與協作。
與後端伺服器的資料溝通
多數網頁需要從網路上的伺服器拿取資料來呈現在使用者的瀏覽器上，並且依據使用者的操作來進行各種資訊的儲存與傳遞。這包含對自家伺服器、第三方服務（如 Google, Facebook 等) 進行網路請求與回應的處理。在各種需要處理的資料中，與核心業務無關者大多會以一些現成的服務做串接，比如說數據分析用 Google Analytics、客服使用 Zendesk 等，也可能需要與各自服務的伺服器傳遞溝通各種不同類型的資料。
讓網頁能在各種裝置各種瀏覽器上運行
只要你有瀏覽器，你就可以開啟網頁？
雖然已是 2021 ，我們有各種瀏覽器 Chrome / Safari / Edge / Firefox，支援的標準也漸趨成熟，但各家瀏覽器的功能與行為仍然不完全相同。相同網頁在各瀏覽器呈現的差異若不好好處理，輕則讓網頁看起來很醜，嚴重者會讓人無法使用整個網頁，因此前端工程師需要花費心力來讓網頁能夠在各瀏覽器上運行如常。
除了瀏覽器，不同的輸入與輸出裝置也是個重要議題，相信你也看過這個名詞： RWD - Responsive Web Design。各種螢幕小至手機大到電視甚至投影銀幕，都可以拿來看網頁，而輸入也有滑鼠、觸控、鍵盤等方式。部分的介面設計是設計師的事情，但工程師會需要協助把這些設計實作到網頁上，比如尺寸多大的時候元件的擺放呈現位置在哪、滑鼠與觸控的操作差異等。
響應式網頁設計 Responsive Web Design
優化前端體驗與效能
前端介面作為接觸使用者的第一線，不只有需要光鮮亮麗的外表，完整的功能與即時的反饋，貼合需求的操作流程，這些元素集合起來才能讓使用者有愉悅順暢的體驗。因此工作內容除了前述的設計細節實作，也需要下功夫程式持續調整網頁效能，讓網頁能快速載入，即時地幫助使用者完成任務。
人格特質
綜合以上市場趨勢、工作內容及筆者經驗，以下特質對於在前端領域的發展會很有幫助：
抽象與邏輯思考力
軟體工程師在做的事情就是：
把我們想要電腦做的事情轉換為電腦看得懂的指令（程式碼）。
這樣的轉換需要掌握許多非常抽象的概念：變數、迴圈、函式等等。前端工程師做的，就是依據這些概念來操控 HTML / CSS / JavaScript ，讓網頁變成我們的形狀。抑或是當我們思考到整個使用流程，也會需要大量的抽象與邏輯能力來把整個流程轉化為一個個步驟並且對應到可以實作的功能。
對美觀事物的感受度
在建造網頁的過程中，前端可說是把各種想法落實的重要角色，各種天馬行空的想法、設計，若前端無法實作或是實作時的細節沒有辦法跟上，那麼就會有所扣分。雖說美感這件事情頗主觀的，但前端工程師如果擁有一些基本的配色、排版的基本原則，那麼將會大幅減低與設計師或其他利害關係人的溝通成本，並產出較高品質的外觀。
重視外觀的人會從完成的網頁中獲得成就感，是個前端工程師的工作動力來源，也促使前端工程師做出更吸引人的網頁。
溝通與表達能力
由前面的介紹可以知道前端工程師是網頁介面的專家，而介面就是拿來給人用的，因此不管開發還是維運都需要與使用者為伍，反映在工作內容上就會有相對多的比例需要去了解使用者，比如說參與使用者訪談、處理使用者的回饋等，抑或是花費心思在使用者經驗上。雖然這些主要是設計師的責任範圍，但前端常會需要參與並且提供技術面的協助。前端工程師是工程師內比較需要與「人」互動的，因此觀察、溝通、表達能力是個相對重要的特質。
持續學習
除了需要大量與人溝通之外，前端領域的概念與技術的變化越來越快，以主要語言 JavaScript 來說好了，他在 1995 年誕生，到 2006 年誕生了 jQuery，而當前的主流三大框架 Angular / React / Vue 則分別是： 2010 / 2013 / 2014。這背後也代表了越來越多資源投入到這個領域，技術因而不斷的推陳出新。好處是前端工程師有越來越多的工具可以使用，開發網頁變得更方便，但也代表著需要持續的學習新的技術、新的工具。因此，在這領域想維持競爭力必須要持續的學習。
前端的技術不斷的推陳出新，工程師需要持續的學習
解決問題導向
前端工程師面對的終極問題是：
如何讓使用者可以在網頁上完成他們想做的事？
每一個想做的功能、想解決的臭蟲背後，是一個個等待被解決的問題。如何在時限內、以現有的技術來完成眼下使用者需要的功能。
在實作功能以解決問題的過程中，慢慢打造出一個使用者能順利完成任務的網站，這也正是前端工程師的價值所在。
對前端有興趣了嗎？
至此，您應該了解了前端的市場趨勢、工作內容及需要的人格特質。下一篇，我們會更進一步的剖析如何成為一名合格的前端工程師，包含前端技能如 HTML / CSS / JS 的需求介紹、學習資源、面試履歷、求職技巧等等。如果看完此文對前端工程師有興趣者，歡迎查看 Yourator 有豐富多樣的前端工程師職缺，也可以 註冊 Yourator 帳號 以收到我們的相關職缺推薦喔～
