關於整個前端生態，其實是有一些分別的。像是遊戲類型，視覺互動類型，javascript工程師，wordpress類型等等..etc。今天要來講的是關於工程類型的前端工程師（不然怎麼叫作前端“工程”師）
個人簡述：6年前端經驗，過去主要專精於網站（pc為主，mobile friendly）， 做過的產品偏C端應用居多。
早期的前端工程師：
記得在6年前剛進入職場，開始我的第一份前端工作時，當時的前端職缺才剛要蓬勃發展，市面上還充斥著前端設計師的職缺。而所謂的前端工程師的要求對於瀏覽器支援度都會特別提到 尤其是ie，至少支援到ie11（我還曾經支援到ie8過..） 現在已經都快絕種了XD。那時瀏覽器還沒那麼強大，你必須要知道瀏覽器，js的行為，做出最好的處理方式。那是個jQuery統一天下angularjs漸漸出頭還有各種mvvm框架的局勢。現在回頭看看可能只剩下jQuery，angularjs還在一些地方老舊專案還看得到吧！漸漸的前端有了bundle gulp，grunt 工程化的出現（除非是舊專案，現在應該也都快消失了） 現在已經都是webpack的天下且許多框架都幫你設的好好的讓你能快速上手開發了。綜觀這幾年的發展，前端確實算是變化蠻大的一個領域。
那身為一個工程師，到底要具備哪些能力呢？先來看看一個身為一個軟體工程師（不論你是哪一種工程師）應持續加強與改善的能力：
- Debug： 任何一個工程師隨著成長，debug的能力都應該越來越快速且精準。而以前端工程師來說 當然就是對 html / css / js / 框架 / deploy / bundle 瀏覽器行為等等的debug的能力囉。
- 溝通協調 co-work：任何一個工程師隨著成長，溝通協調 co-work的能力都應該越來越有效率。擁有良好的溝通協調與 co-work能力絕對只有加分。
- 自身管理，專案管理與軟體開發能力：任何一個工程師隨著成長，對於自身管理，或者是各式各樣的專案管理與開發模式中都應能快速適應，並給予團隊適當的建議。
- git：你了解或者聽過各種開發流程git flow，github-flow， trunk-base..etc，並能在你們團隊適應或者建立一定的良好開發流程。對於使用git的能力，不論你是用圖型化介面操作，還是喜歡自己打指令，你至少要明白當衝突的時候要怎麼解決，你的線長什麼樣子，pr or mr 還有code review機制（即使你的團隊不在意，你也應該知道好的開發流程線應該是長什麼樣子並給予建議）。
那現在的前端工程師應該長什麼樣子呢？我覺得要先來強調一點，做出產品/專案只是基本中的基本：
- 瀏覽器行為的了解：其實這點在瀏覽器的進步與現代框架的保護下，漸漸的不被處理到了。
- 不依靠框架的HTML，CSS撰寫能力：這點是我個人認為身為一個“前端”工程師應該要具備的能力，但這點因人/產品而異（to C端的產品比較需要pixel perfect的UI實現，但如果都是做後台系統甚至設計師好配合的話可能就相對不需要）
- RWD mobile，平板，desktop的UI實現與幫助設計師考量的能力：這點我個人認為也是前端工程師的價值所在之一。
- JS的了解：身為工程師的一員，你應該要了解你寫的程式是什麼，雖然現在許多框架的應用讓你只需要專注於框架，但若沒有對JS的足夠了解，即使能夠做出專案做出產品，也容易缺乏解決問題的能力。如何寫出好維護，可讀性高的程式碼，這點可說是“必備”的條件且深入的程度可能是決定你薪資的程度。
- 任一框架的了解與實作能力：這點其實不難理解，身在現代的前端工程師，勢必要了解並有能力透過三大框架(react, vue, angular)實作產品。
- CSS的了解：有聽過repaint與 reflow嗎？沒聽過也沒關係，甚至排版幾乎也被flex統一幾乎很少需要關心浮動之類的問題了。選擇一種你擅長的工具ex: css-preprocessor, css module, style-component..etc. 基本上你有ui實作的能力，這點基本上已經不會有太多的深入問題，除非是還在維護許多舊專案的公司。
- 追蹤user行為 - ga：有的人可能認為這是行銷那邊應該要負責的，但許多行銷單位可能只知道觀看ga dashboard上的資訊。身為一個前端工程師，如果能幫助行銷單位或是公司更好的理解ga能夠提供的資訊(像是ga event query)甚至建立自動化報表，我認為是很有價值的。(推薦data studio 或者google sheet就可以用了!)
- SPA ，SSR(nodejs)的了解：nodejs基本上已經是前端的一部分拿來當作application server。
- Seo：這點也是因產品而異，近年來seo的變動也算是變緩很多，基本的seo網路上都有許多文章，如果你的產品是非常需要Seo的話，你可能甚至得寫出好的html5 tag來幫助seo.
- ui一致邏輯：身為一個前端工程師，勢必要有一定清楚的ui邏輯，來彌補uiux designer / pm的不足。以web來說，同一個頁面光是從別的頁面進來或是直接從url輸入近來可能就有一些頁面行為上的不同。而在同一個專案(甚至是同一個公司)中的ui元件是否都應該要有一致的行為，是不是都要有儲存/取消按鈕? 還是enter就好? 編輯狀態應該會是怎麼樣，排版應該怎麼考量等等非常多細節都是你能帶給uiux designer，甚至是pm流程上的建議。
- 適當的ui互動：這點同上，只是這邊強調的是ui互動上的細節，例如當我點選這個按鈕展開時其他東西是否該關閉? 然後適當的ui回饋，按鈕的各個狀態，一些行為結束後的alert message等等之類，這邊想表達的是這是身為前端的一部分責任，不要覺得這是uiux / pm的問題，畢竟你是最後實作的人，除非你在實作的時候都沒有感覺..或是你在的環境並不需要你有太多意見。
再深入來看看，如果是對於資深前端工程師的要求呢？
- UI交互行為思考能力：這點直接延續上面，能幫助到越多，價值越高。但溝通技巧就是另外一回事了（不要吵起來啊..我們工程師請盡量站在尊重專業給予建議的角度就好）。
- 手刻，不被框架侷限的pixel perfect design實現：延續上面，你應該對於任何一種web形式的網站都有一定的概念與了解，且能夠盡力實現各種uiux designer的想法，。
- Plugin 考量：該手刻還是使用plugin，對於各種plugin的評估，下載量，星星數，維護程度如何，版本狀況等等，對於使用在專案中的優缺點考量。
- 維護與改善能力：有一個現象很有趣，就是當接手別人的東西的時候常常會覺得這裡不好那裏不好XD（應該不只工程師，各行各業可能都有這種現象） 於是就想要翻掉。這理想表達的是能夠翻成自己的code是最容易的，能夠維護並改善各式各樣的歷史共業其實也是一種價值（總不能東西到你手上接手說改不動吧，而且有時東西也不是說翻就翻）不過有的人可能就是只想做開發..或者受不了就一直換到下個地方開發了（然後前途無量呵呵）
- Test能力：你應該有能力去做各種unit test, e2e test（是否有時間做這就看環境與重視程度了）如果環境讓你沒機會去碰到，那你就做一個side project來自我精進吧！
- es2015, typescript：es2015已經是現在必備的條件之一囉，再來是個人認為typescript會是前端的下一個邁進，純屬個人認為，多去了解相信只會有好處不會有壞處的。
- 實作 模組化 reusable component 能力並呈現良好的guide - storybook：你應該有能力實作任何web component 像是modal，carousel，dropdown等等（有能力實作不代表你一定要自己做）。有些地方會擁有自己建立的component庫，或者你們打算自己建立起來，那勢必要有個好的guide，storybook是個很好的工具。
- 建立你的前端架構：你應該熟悉webpack設定，在意bundle size，code splitting，lazy load等等之類。熟悉前端的各個環節細節。
- Code review：良好的code review機制很重要（不是要你們互相抨擊啊）這需要有良好的文化與人來實行。
- 大前端時代 延伸 - firebase graphql：不管你喜歡或不喜歡，這些讓前端延伸領域的東西也已經持續在發生了，也許不會是大眾，但身為前端一員的你應該沒碰過也至少了解過或去實作過。
Other：
app - web app也是前端的一個部分了，pwa，react-native，desktop app - electron等等。
webVR，streaming，小程序，robot，wordpress CMS等等，就不做追述。
相關延伸領域的了解：（看你延伸的方向往哪邊，你能額外提供的價值就往哪邊）
uiux方向: sketch, ux各種研究方法..etc.（好像很少聽到有前端變uiux的）
後端方向: CI/CD, backend server, db..etc. （這是很常見的一條路）
總結：
當時的我選擇與決定當工程師寫程式，一部分原因也算是喜歡那種活到老學到老的精神，而相對於面對機器面對資料，我反而更希望面對介面能夠去改善使用者體驗相關。於是便一路在前端領域耕耘至今。額外碰過了wordpress，react-native，webVR，firebase等等東西，後端領域也寫過api，sql，MVC等等，多少對整個系統各種開發有些了解。因緣巧合下也接過一些案，回頭看看算是走了一條蠻幸運的前端路吧。
現在前端領域的改變已經趨緩，未來會發生什麼也還不知道，從我個人的角度來看前端工程師，最基本的對js的熟悉程度與了解，與是否有能力建置出一個好維護的ui &website（曾經面過某知名大公司的leader，給予其一個小時的時間做一個很簡單的表單CRUD，有popup相關行為不限任何框架然後該面試者主動表示差不多了結果卻完全沒有ui，行為也只做了一點點..）另外我個人建議至少做過開發一種C端產品，實現過pixel perfect並參與過產品的討論，ui的細節討論，對這些東西有一定想法是很重要的。
有時常常會覺得是否要一點一點跨到後端去但覺得實在是個大哉問（後端也是逐漸在發展呢 gcp, docker..etc.）。必須要思考的是身為前端的我們最後能夠走到什麼程度？以及你能提供的價值到底是什麼？
感謝你看完個人的一些心路歷程與感想。謝謝。
