在講這個主題前，我要來分享個人經歷，在創立高雄前端社群後，常會有人敲我訊息說對前端有興趣，想瞭解要到什麼程度才有辦法滿足職場需求。

當然在業界久了，自然可以推薦一些學習資源與方向，也協助幾位朋友投入前端，但過沒幾個月，他們不約而同出現以下對話。

朋友A：「洧杰問你一下，主管要我研究前端的 XXX，但都沒有頭緒怎麼辦？」
我：「哦，這在網路上有蠻多教學資源的，有先搜尋嗎？」
朋友A：「有啊，但都好難....怎麼辦壓力好大」

朋友B：「老闆要我用一個 HTML5 JS API 搭配 Google Map 開發一個東西，你那裡有 Code 可以參考嗎？」
我：「那段整合我沒碰過，你有看下 GitHub 有沒有相似的專案？」
朋友B：「你找比較快啦，之前都你提供資源給我的，給我個範例後面的我會再自己搞定啦 >”<」
我：「...囧」

此時才意識到自己反而害了他們，以前都習慣幫他們找適當的教學資源方便他們消化，但並沒有培養他們自行尋找學習資源，並內化成知識的能力。用常見的俗語就是「只給他們魚，但並沒有給他們釣竿」。

也因如此，在協助學生轉職前端時，我都會請他們做以下事項：

培養關鍵字搜尋的敏銳度

我在六角學院協助學生轉職前端時，當我覺得對方學到一個深度後，就會開始幫助對方去試著自主學習新語法。例如你會 HTML、CSS 基礎排版後，接下來就會請他去研究什麼是 transition，接著試著用 animation 設計一個動畫效果。如果是 JavaScript ，懂陣列、函數、物件操作後，就會再進一步投入中階語法以提升他們對程式的掌握度。

接著他們就會依照我前面章節提到的「如何有效率地 Google 尋找問題與解法」開始自主搜尋答案，畢竟我並不能幫學生培養搜尋關鍵字敏銳度，因為大腦是他自己的，我沒那麼強可以幫他的大腦升級。

在你吸收一個問題時，你該下什麼關鍵字可以找到最接近的答案，成功與失敗數千次後，大腦就會自動建立專屬於你自己的搜尋流程引擎，遇到問題時，直覺就知道到某個技術論壇會比你到 Google 大海撈針有效，或是印象曾經有在 YouTube 找過豐富資源等等，當你這流程優化到個極致後，自然能幫助你在找問題能夠更聚焦地找出答案。

我在幫學生培訓時，也會出一些題目，讓學生們能夠培養「自主解決問題」的能力，並實作出前端功能提昇技術廣度，這裡也釋出部分題目，提供各位朋友參考與學習。

評估技術複雜性

你需要有個認知，當你進入公司開發產品時，實作一個功能絕對會是很多個技術組合起來。舉例來說有個頁面要有好幾個時鐘，並即時顯示各時區的時分秒資訊。你可能知道 JavaScript 已經可以產生時間，但為了要顯示各時區，就還必須瞭解 UTC、GMT 是什麼，那些國家的時區要如何歸類，以及 JS 與 CSS 該如何控制，才有辦法做出一個動態時鐘出來。這在程式世界是家常便飯，因為你不是「學程式」，而是「設計程式做出人們可以用的服務」。

當主管在問你是否能實作出一個產品的重要功能時，你是否有辦法評估技術複雜性？

只知道七八成，其它兩成你完全沒聽過，不過曾經從網路或朋友得知早已有實作方案，自然當下回應這部分是可行。

只知道五成，另外五成你當下沒把握，雖然沒辦法即時回應主管是否能做到，所以告知給你兩三天研究，嘗試在最短的時間內做出一個最小可行性產品確保 ok，以回應主管這功能核心的技術都能達成，讓主管回應上層此技術的可行性。

如果是完全不懂的東西，主管只好給你個時限去研究，那你有沒有辦法將複雜的問題細分化，投入過程中瞭解自己距離目標還有多遠。假使如實交付，你能夠肯定自己，如果需要延期，也絕對不要拖到最後一天才告知主管，這樣他也沒辦法向客戶交代。

人在遇到未知會感到惶恐是理所當然，在程式世界上，更是家常便飯。所以會建議各位面對它，並善用番茄鐘來瞭解自己的投入狀況，當你將這個循環投入數百數千次後，自然就離資深工程路也不遠矣。

先找出自己可以吸收的內容

以前我在實作一個主管交辦的功能時，會在網路上搜尋各種教學，有時候我會發現某個東西就是我要的，不過還是需要改一些內容才能放在我的專案上，但卻搞了很久都弄不出來。我甚至會亂下一些語法，自己也不知道自己在幹嘛，只求其中一行程式碼可以動，我就可以準時下班。想當然爾最後都沒搞出來，只留一肚子鳥氣回家。

這問題也是出在於技術債欠得太多，明明這功能你會有兩三個核心原理必須先搞懂觀念，但是你視而不見，試圖硬改現成的 Code 期待奇蹟發生，這本來就是很天真的想法。

欲速則不達，先找自己可以吸收的程式碼，等到觀念融會貫通後，做出自己想要的功能還不難嗎？

複製貼上是家常便飯

在我的前端生涯中， Ctrl + C、Ctrl + V 算是排名前五名的熱鍵，例如要引用別人的動畫效果、一段複雜的正規表達式不知道怎麼寫，於是上網找解法。你要瞭解任何事情都要自己從零寫到有，自然是不可能的事情。

例如我是後端工程師，因為專案都必須處理複雜的商業資料庫邏輯，但剛好前端缺人手，所以只好自己用 Bootstrap 框架處理前端問題，自己不用寫太多 CSS，也能夠排出堪用的版型。或是顧客想要一個比較炫的轉場效果，你沒有 idea，只好去 CodePen 尋找靈感，並看是否有適合的效果。

工程師其中一個重要工作是在「整合」，一個中大型專案上絕對會是用了好幾個套件、部分邏輯不懂所以複製 StackOverflow 投票數高的程式碼，同時也包含你自己為產品寫的商業邏輯程式碼。

你也不用覺得一直複製貼上很丟臉，覺得自己沒做啥事，在持續複製貼上過程中也會貼出一種感覺，提升你對 Code 的敏感度，但要記得自己是「有意識的貼上」，而不是死馬當活馬醫亂貼而完全不懂原理，如果程式碼有太多部分是你不懂的東西，最後專案爆炸的機會也會跟著變高。

判斷問題對錯，不要全盤盡信

在網路上找的東西不要全然相信，例如我常遇到學生請我 Code Review，發現一段程式碼是錯的，詢問他才得知那段 Code 是複製某個部落格工程師上的 Code。結果才發現因為程式版本變更，Code 也跟著不兼容了。

也呼籲在搜尋問題時，都要抱有「持疑」的心態，吸收到的知識就大膽假設小心求證。寫程式沒有正確答案，今天可以跑的程式碼，明天瀏覽器版本可能就不能用了，你無法找出「最完美」的程式碼，但至少你能找出「當下適合情境」的程式碼。

提升解决問題的思維和方法

以我上面貼的題目連結，你會發現前端不單純是做網頁開發，現在的 JavaScript 可以做的事情相當多，那為了要培養解決問題的思維，就必須深耕自己的能力，很多人都會喜歡拿「投入一萬個小時才有辦法成為專家」的話來講，這裡我想說所謂個一萬的小時，不是你已經會的東西重複做一萬個小時，而是知道自己哪裡不足，刻意去補上你不懂的前端領域知識，除了提昇技術深度外，同時也在加強你遇到問題時解決問題的能力，如此一來遇到任何事情時都能依照自身的一套心法去解決問題。