如何成為前端工程師，當你不是相關科系、不會任何程式語言
目錄
- 前言，怎麼使用這一篇文章
- 自我介紹
- 達到進入業界的最低門檻
- 如何準備，有什麼訣竅
- 得到第一份工作之後，如何整理未來的方向與藍圖
前言，怎麼使用這一篇文章
我希望你能夠有脈絡的利用這篇文章，所以會寫得有些生硬。即使如此，我還是會盡量講解的有趣及好理解一點。
在開始閱讀之前，你可以利用目錄了解這篇文章對你有幫助的部分。你可以重頭到尾閱讀整篇文章，也可以只挑你有興趣的部分閱讀。
我的建議是這樣：
自我介紹與主要內容較無關係，如果你想了解寫這篇文章的人是什麼樣的人，再選擇閱讀(當然，你讀了我會很開心的)。
如果你還不是前端工程師，同時有目標是拿到一份前端工程師工作，可以從達到進入業界的最低門檻及準備的方向，有什麼秘訣章節下手。
如果你剛剛進入業界，已經是一位前端工程師，同時想要了解未來 1~3 年的準備方向，挑戰更高的薪水。就從得到第一份工作之後，如何整理未來的方向與藍圖開始吧。
你的時間很重要，資訊的篩選同樣重要。請選擇對你有幫助的部分閱讀。
自我介紹
我的綽號是引擎( EngineLin )，畢業於中興大學環境工程學系，但對這個科系感覺不到熱情。當同儕選擇就讀研究所與準備環工技師證照考試的那幾年，我進入富邦產物保險當一名默默無名的小業務。
我在大學四年到畢業後三年這個時期，玩心很重，對旅行有著憧憬。那時候訂下目標後一頭熱的栽了進去。
我在大學畢業那一年，揹著一個喬丹紅色系大背包，做了一個 Facebook 比讚造型攔車牌，便開始攔便車環島。一路上認識需多親切的人，第一次踏上台東這片土地。原來台灣這麼漂亮，這個想法不斷在腦還中冒出來。於此同時，另一個潛藏已久的想法一直在發酵。
我想要到世界各地走走。
如果地球是一個大房子，我生活在這裡。那麼我不希望自己一輩子只待在房間裡，我想了解廚房、客廳、長廊、花園......我想親眼看看那些只出現在故事中，卻沒有實體感的地區。
這是改變我人生的轉捩點，為了成為旅行背包客，我開始加強萬年殿底的英語能力(重點放在聽力與口說)，以及在富邦的一年半努力存旅遊資金。
在西元2016年6月份，我揹著搭便車環島時的喬丹紅色系背包(這時候它被塞得鼓鼓的)，開始了自己的環遊世界之旅。
我走過東南亞、歐洲與北美州，住了 50 幾個不同地區，共計 30 幾個國家，繞了地球一圈。這個大房子我走走看看，體驗了 1/4 。
這趟旅行促使我開始思考：
1、不同地區的生活品質會受到地區影響，自己要如何突破環境與地區的影響？
2、在巴里島與清邁遇到許多遠端工作者，如果我希望像他們這樣工作，我該如何做？
回國之後我在尋找能夠達到目標的產業，然後我選擇了前端網頁工程師。這是一份能夠抵抗薪資高牆、便於轉型遠距離工作的職業。
現在的問題是，我如何盡可能快的進入這個產業？
達到進入業界的最低門檻
避免見樹不見林，能夠提升學習效率與調整進步方向的方法，就是在開始之前盡可能了解整理架構。
包含你需要走過的地方以及你可能遇到的階段，我認為後者更加重要。了解自己可能遇到的困難，就能夠提前武裝心態；知道前輩跨越了什麼技術門檻或者持續多久的時間就會豁然開朗，就能夠在學習的路上多一份堅持。
先讓我們看看成為前端工程師需要那些技能。
這是六角學院製作的前端網頁工程師會接觸到的技能樹，我們要進一步篩選進入業界需要的最低門檻。
結合我面試公司初階前端工程師職位被要求與詢問的問題來為你解說。
絕對需要有(也就是你的目標項目)：
1、HTML、CSS
2、JavaScript 以及 JS 底層的運作知識
3、RWD
4、JS 三大框架的基礎下寫出來的作品 (選擇一個你喜歡的吧，但現在面試最常被要求的是 React )
5、GitHub (就算公司沒在用，你還是需要靠它找資源讓自己成長)
盡可能學起來：
1、Bootstrap
2、Flexbox 概念
3、重要的 API : GA、Google map、FB Graph
4、jQuery (這我不太確定，因為會這個似乎已經在業界是必須的，但公司專案卻不一定會用到......)
5、AJAX 後端資料串接
有時間再去學:
1、Sass 或 Scss
2、Pug
3、Gulp
你可以在圖中找到所有的項目，了解它所在的位置。上網查詢它們的功能，如果你感覺陌生的話。
我們再一次聚焦目標，目標是知道面試工作時被要求學會的技能中，重複率最高的幾項，面對一百間公司，當然會因為公司文化、公司客戶面向等等因素，對初階工程師有不同的條件需求。
但是一定會有相對重要的技能，你一定要掌握。在這裡就是上述絕對需要有部分的技能。當你掌握這些技能，搭配幾個盡可能學起來部分的技能，可能就是一間公司的求職條件了。
另外我想提醒你，聚焦在面試需求的技能上面是快速找到工作的好方法，卻不是最輕鬆的方法。很多時候還會影響學習效率。
程式語言是一個龐大的體系，但是核心思考的方式是類似的。也就是說，當你學習越多不同的技巧與語言，你就會對其他語言越熟悉。
最好的學習曲線並不是單純學習絕對需要有部分，而是交叉學習、循序漸進，讓學習更有成就感，避免鬥志的火苗被熄滅。
不用擔心，我按照這條學習曲線學習，直到找到工作一共只用了兩個半月。
(2019/11/01 更新：
現在台灣的前端求職環境已經有不少變化。首先是資淺的工程師數量增加，但是資深的一樣缺人；再來是對面第一份工作的能力需求增加，因為技術的更新，對於第一份工作來說前端框架已經是必須技能了。比較沒辦法像我那時候對 Vue 還一知半解的情況下找到第一份工作。
總結來說，針對第一或第二份工作，現在的求職門檻提高，相對比較競爭。建議可以給自己半年到一年得時間準備，會比較符合現在的環境。)
這條學習曲線如下(按照順序) :
- HTML、CSS : 作業 - 做一個簡單的自我介紹頁面
- jQuery : 作業 — 為第一份作業加上動畫
- RWD : 作業 — 綜合前面所有技能寫一個響應式履歷 (當然要加上動畫讓它與眾不同)
- JavaScript (以下簡稱 JS) : 真正的程式語言來啦 ! 能學的東西太多，先學習基礎語法，寫一個 todolist 頁面。然後把重心放在下面幾項。
- AJAX 串接 : 作業 : 找一個公開平台資料串接，做個頁面顯示出來
- 大型公司的 API : 推薦從 Google map 開始，因為最簡單。Graph 要申請權杖或金鑰比較不直觀。
- GitHub : 至少要會用系統的命令字元下載跟上傳檔案，然後把 GitHub Page 學會。
- 挑一個 JS 大型框架 : 目標放在用最簡單的功能寫出一個小頁面，你要讓面試官知道你有用 Angular、React 或者 Vue 寫過網頁就好。
- 最後，買 Udemy 上的 JavaScript 全攻略：克服 JS 的奇怪部分 或者到 PJ 大大的部落格看他寫的筆記，這個部落格都是寶。這個部分相當重要，因為如果不是相關科系的學生，再怎麼寫 JS，還是不會了解 JS 底下運作的方式。而這個運作方式，在面試的時候幾乎百分之百會被拿出來考。
你回答得出來，面試成功機率會直線上升。
這是學習曲線比較不陡峭的安排方式。先學習 jQuery 再轉學 JS 也是為了理解 DOM 的擷取方式。等動畫的製作方式比較熟習後，再接觸更加萬用的 JS。
你能夠上任何一間人力銀行網站搜尋前端工程師職位，比對公司的技能需求，來決定你的學習方向。相信不太會跳脫上面的範圍。
下一個階段，我們要開始思考，怎麼學習才有效率。進一步壓縮學習所花費的時間。
如何準備，有什麼訣竅
如果你有在追蹤知識型 Youtuber，大概會發現有這麼一本討論度極高的書：精準學習。希望學習的精準又有效率，重點在於正確的方向、有效的方法以及即時的回饋。
如果開始學習轉職前端工程師需要的技能之前，沒有花費時間規劃的話，未來就會為努力錯方向而浪費更多時間。
透過上個章節，你已經知道學習的正確方向，學習面試與工作上確實需要的技能。這個章節要思考何謂有效的方法與即時的回饋。
１、有效跟有效率是不一樣的東西。有效率指的是更加快速地完成任務，而有效更加提昇一個層次，指的是更加快速地達成目標。差別在哪裡?
如果你學習很有效率，但面對達成目標卻沒什麼效果，便是落入了高效率、低效果的陷阱。在這裡，我們的目標是得到前端工程師職位。有效的方法我認為是：累積技術的代表作品。
你應該在學習的同時不斷找可以用來製作作品的點子。例如：履歷、圖片牆、聊天室或任何網頁應用。
試著這樣做，到人力銀行找幾間喜歡的公司，將他列出來的技術項目列出來，然後每一項製作一個代表性作品。如此一來，面試的時候就利用作品說服面試官吧。
這邊我要補充一點，使用這個方法的時候請對照上一章節提供的技術列表。很多公司寫上去的是如果會了會很加分的項目，有些公司則是對技術不太熟悉，就一股腦把聽過的技術寫上去。不論如何，上一章節的技術列表才是你應該先學習的。
另外，前端網頁設計師跟前端網頁工程師是不一樣的。如果公司要求設計技術，這個職位可能不是很純的工程師職位。
２、找到對的書跟資源，求質不求量。非常非常重要，選擇好懂的資源，然後認真專研一份就好。
書單推薦(利用天瓏書局一口氣買下來吧，或者看看住家附近的圖書館有沒有)：
推薦資源：
推薦課程：
當然，這只是我使用過的清單，相信網路上可以找到更多人推薦的好書與資源。你要非常小心的選擇，因為你投資的時間是否對目標有效，你選擇的資源要付一半的責任。當然，只要你喜歡，決定權在你身上。只要記得，好好挑一本，然後就認真的讀那一本吧。
３、找到可以引導你、為你解惑的前輩。這是很多人學習艱深技術時忽略的部分。我相信，完全的自學是可行的，也有相當多成功的例子。但是當學習的技術越專業、你希望的學習效果越好(通常代表花費越少時間)，找到一位能夠帶領你的前輩是最好的方法。
你能透過，網路或社群網絡上尋找、從朋友圈尋找或者挑選實體或線上課程來找到你的技術前輩。
我並沒有上過大量的課程，因緣際會下接觸的課程是hexschool，價格便宜、老師會花費相當多時間輔導與指引我遇到的問題，直到現在(費用已經一次買斷了)我已經開始工作，這裡的老師依舊不斷提供新資源給我這個畢業校友。相當推薦。
網路上還有許多優質的課程，可惜我還沒有全部參與過。如果你無法找到引導你的前輩，考慮看看參加大家都推薦的網路課程。
４、當你的具備基礎的技術，寫一個以作品集為主的履歷。將履歷公開放在人力銀行(你或許會驚訝的發現開始有公司主動請你面試)，同時找自己有興趣的公司吧。
你能夠參考看看我寫的履歷範本
當獲得面試經驗後，重點就是練習面試技巧。並不是以技術為重的職位(就是工程師們啦)就認為技術代表全部。面試技巧不單單決定你錄取與否，還會決定你的薪水！而且你未來也會不斷用到。你應該認真看待。
上網查面試技巧，或者挑選幾間並不是夢寐以求的公司當作砲灰，練習面試。對了，hexschool 似乎有提供免費的面試練習跟檢討機會。自己寫信去詢問看看，表現一下你的積極。
最後，我只面試三間公司，也成功拿到三間 offer。感謝過去兩個半月努力的自己，希望你也能夠迎接這個掌控自己生命的瞬間。
得到第一份工作之後，如何整理未來的方向與藍圖
如果你跟我一樣是剛成為前端工程師的新鮮人，恭喜你，希望你喜歡你的工作。促使我選擇這份工作的原因除了開頭提到的能夠抵抗薪資高牆、便於轉型遠距離工作之外，就是我熱愛學習新事物。
一但成為前端網頁工程師，你要將這句話放在心上：前端網頁工程師之路，就是永無止盡的學習。
你我都有太多東西沒有學會，所以保持謙虛、持續學習就是未來方向與藍圖的核心指標。基於這個理念，我希望你不要讓公司剝奪太多下班時間，更不要自己剝奪自己的學習時間。養成每天下班都要學習30分鐘的習慣(當然你可以加長或縮短)，周末到咖啡廳假裝自己已經是成熟的工作者，找些新題目來玩玩、寫寫(想不到題目？跟指導你的前輩要吧)。
當然，這個章節不是只講這麼空泛的東西，還是有些具體的項目你該知道。
首先，再次開啟人力銀行，開始找些薪水更高、技術更加刁鑽的職位(判斷標準就是你下一份希望躍遷的職位)，先別管年資，將公司開出來的技術條件列下來。這是我們在公司工作之餘，還要努力學習的技術。
因為不同公司、不同職位用到的前端技術不相同，工作提升技術，卻可能只學習到更高薪水的職位需要的技術的 30%，該怎麼辦？利用老方法，列出需要但是目前公司用不到的技術，利用學習時間研究並做一些代表性的作品。
你的薪資成長幅度來自於你技術的不可取代性。越難學習、越難找到人才的職位，薪水就越高。透過人力銀行了解現在最缺的技術是什麼，然後成為那樣的技術人才。
這是以薪水為導向的準備方式。
值得一提的是，學習 JS 三大框架是其中的必要條件，這已經是成為資深前端工程師的必備技能了。不單純是會寫，而是要深入研究，然後搬出有看點的作品。
其中，每個框架必要的重點是生命周期。我的老師跟我說的，我也還沒研究透徹，但絕對是相當重要的一部分。
如果你找不到就職期間的提升目標，就找一個 JS 框架 (公司有在用那非常好，公司沒在用就強迫自己還是要抽空學)研究，然後不斷寫作品，屆時你的能力會越來越強。更棒的是，這個能力還是業界渴望追逐的專業能力。
