如果需要前端工程師一定要先知道的事情-上
對我而言,前端工程師是一群,橫跨設計與工程領域,美感理性兼備,對於Web充滿熱情,相信自己可以利用Web改變世界的傢伙。
而這篇文章點出一些對前端工程師的迷思,包括:前端門檻是否較其他軟體工程師的門檻低?為什麼我們需要前端而不是全端。經歷過這些年網站開發變革的前端們,閱讀這篇文章會特別的有感觸。
有 趣的是,就算是發展較成熟的歐美網路產業,對前端仍然會有這些迷思與誤解,可想而知,台灣在這塊領域上,仍有很多路要走。透過這篇文章,可以了解所謂專業 的前端工程師,需要具備的技能;也能知道何謂不及格的前端工程師。什麼是你不可錯過的前端奇才。業內的讀完可以三省吾身,業外或是對這塊領域有興趣的人, 也能窺知一二。
有天,作者偶然在Quora上發現一個跟前端工程師及新創公司有關的問題:「為什麼新創公司很難找到前端工程師?」
該討論串的的原po提到:
『(前略) 我想多數人都同意前端開發比其他軟體工程領域簡單一些,那到底為何那些新創公司還是很難找到前端工程師?』
我看到幾個不錯的回應,這些回應大多一針見血。而根據過去我尋找前端職缺,面試前端工程師,以及平常在前端專案裡的工作經驗,以下提出我的個人意見:
這是個相對新的領域
首 先最簡單的答案就是 「這是個新領域」。很多人可能不同意這句話。因為前端工程幾乎等同於網站開發,而網站開發領域也發展超過20年了。 然而,作為一門實作使用者介面(Interface) 及使用者體驗( User Experiences) 的技術,以特定的領域而言,前端工程仍是個相當新的觀念。其中「工程」的部分更是在幾年前才開始發展。
時至今日,搞混Web開發與前端工程的情況仍所在多有,這怨不了誰。對多數置身Web產業外的人來說:Web開發介於網頁視覺設計與其實作技術之間,存在著模糊的空間。說到底,前端工程師還是在做一些網站開發的工作,不同之處在於,他們只著重在牽涉使用者的部分。
實 作使用者介面與使用者體驗這個技術領域,則是最近才開始被賦予名稱的。在15年前或更久之前,人力被分成網頁視覺設計與技術開發兩種。但隨著Web的成 長,網頁不再只有到達頁(landing page)與行銷的目的,對工程師的需求也明顯增加。人們開始學習JavaScript,後端技術,使用者體驗,資料庫,甚至是網站系統設計。如今,像是 AirBnB、Facebook或是Quora等網頁應用程式,在工程師的人力資源投注上也比在設計師上來的多。換句話說,產出網頁的視覺設計,然後實作 出來變得更加快速。這並不代表網頁視覺設計較不重要,或是投注在其中的資源比20年前來的少,而是今時今日對於Web工程師的需求比以前更大了。
因 為網站實作的技術牽涉到很多不同領域,90年代中期的Web工程師們可以說是十八般武藝。他們可能是兼具資料庫管理者、系統管理者、後端工程師、軟體維運 人員(DevOPs)、軟體工程師、使用者體驗工程師跟前端工程師。最新也是大家最怕的的一件事,用JavaScript、HTML跟CSS把設計圖上的 樣子刻出來,還要讓他在瀏覽器上看起來有模有樣。要能在前端的領域裡悠然自得,除了得對視覺設計有些興趣,某種程度還要是個被虐狂。
很明顯的,當你應付了幾次Web應用程式大量的需求後,你會發現這一拖拉庫的技術工作,需要各種不同角色的人分工完成。我不知道哪些工作比較費時,或哪種角色比較累(注1)。但現實就是,很多公司或 網頁設計 公司發現:一個人不可能處理好各種技術細節。我之前提到的那些工作描述:像是後端工程師,資料庫管理者等,都屬於Web產業的一部分。記住,這些工作多數已經行之有年,但在Web產業中,都是在近十年才明白這些職缺所要求的技術能力。
誤解
另 一個很難找到前端工程師的重要原因 ( 對我來說這點最重要 ),因為這是一個被誤解的領域。如同原po在他提問中所述,大多數人認為前端工程師是一個「相對簡單的領域」。用一個之前流行的比喻 -「大多數人覺得 XXX 是 (What most people…)」,我們來看看套上前端工程師會是怎樣:
大多數人認為前端工程師是:
1.拿PSD檔,圖片或是草稿,然後把他轉成網頁。
2.有時候只是拿以前的PSD檔,圖片或是草稿來設計(改一改)。
3.用Javascript來寫動畫,做出網頁裡的過場效果。
4.用HTML跟CSS來寫網頁裡的內容跟外觀。
前端工程師真正在做的事:
1.建立一種設計師與工程師之間(溝通用)的圖像化語言。
2.從視覺設計的角度來看,定義一組元件來呈現內容、品牌跟功能等…
3.建立一套Web應用程式的基礎,包含規範、框架、需求、圖像化語言( Visual language )跟規格。
4.定義Web應用程式支援的範疇,包含裝置、瀏覽器、螢幕與動畫。
5.寫一份QA指南,以確保品牌忠誠度、程式碼品質,以及產品都有讓相關人士審視過。
6.寫(Style)一個Web應用程式,要運用適當的空間、圖片、排版(typography)、標題、字型、icon、內外邊距(padding / margin)、格線系統(grid)等。
7.寫(Style)一個Web應用程式,要能考慮到不同解析度的圖片,多種裝置為導向的樣版圖,還要兼顧設計指南。
8.下Web應用程式的標籤時,要考慮到語義 ( semantic ),accessibility,SEO,schemas 和 microformats.
9.連 API 抓資料時,要能採用友善,不耗電,了解目前用戶端與裝置狀況的方式 ( 譯者按:舉例來說:針對行動用戶的網路與硬體的限制,改變拉資料的方式來避免電池與頻寬的消耗 )。
10. 用戶端的程式開發,要能呈現順暢的動畫、過場效果、延遲載入(lazy loading)、互動效果及操作流程,其中大多數的時間都耗費在漸進增強與向下相容標準。 ( 漸進增強:例如為了在設計與效能間取得平衡,某些前端的效果,例如漸層色,陰影等,只能有條件的支援舊版IE)
11.確保與後端間的連線是安全的,考慮使用跨網域資源分享( Cross Origin Resource Sharing (CORS) )時,要避免XSS跟CSRF的狀況發生。
12.不要忘了,不管多嚴格的結案期限,相關人士的各種要求,以及裝置的限制,永遠把使用者擺在第一。
參考文獻:
1. 張婷玥(2006)。顧客體驗與體驗品質之概念性研究。國立政治大學企業管理研究所碩士論文,未出版。
2.吳政隆,2002,以XML 為資料擷取介面之審計系統實作,私立中原大學會計系碩士班未出版論文。
3.陳柏任,2001,網際網路財務報告揭露之系統架構研究,私立中原大學會計系碩士班未出版論文。
資料來源:lockchou
最新文章
HVACKer:入侵隔離網絡的新型攻擊技術還有什麼不會被入侵?路由器 LED 燈已成為攻擊入口美 5 家獨角獸同天申請 IPO 掛牌,最狂的是一家估值 124 億美的數據分析新創!【台灣「智慧產業」開始佈局】緯創集團領投跨國 AI 新創 iKala,下一步拓展東南亞市場快可以用手機遠端遙控你的所有家電了