iT邦幫忙

2018 iT 邦幫忙鐵人賽
DAY 6
7
Modern Web

前端工程師養成手冊系列 第 6

盡早培養「自主解決問題」的能力

  • 分享至 

  • xImage
  •  

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

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

朋友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 尋找靈感,並看是否有適合的效果。

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

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

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

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

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

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

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


上一篇
要掌握一個技能,將自己丟在對的環境超重要
下一篇
寫爛 CODE 是學程式必經之路
系列文
前端工程師養成手冊30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中
0
牙膏大師!
iT邦新手 4 級 ‧ 2017-12-09 00:14:59

糟糕,有種這個系列文會是神作的預感

廖洧杰 iT邦高手 2 級 ‧ 2017-12-09 00:23:50 檢舉

謝謝支持,好久沒參加鐵人邦了,希望能順利完賽 XD

0
蔡世恩
iT邦新手 5 級 ‧ 2017-12-09 11:16:17

我一直都覺得沒有從頭自己想很丟臉的說@@原來很常見

廖洧杰 iT邦高手 2 級 ‧ 2017-12-10 01:42:30 檢舉

不要把工程師神化了,每個人都是從平凡開始出發

0
yuski
iT邦新手 4 級 ‧ 2017-12-09 13:58:05

校長設計的自主解決問題題目
讓我對前端有更深的認識,
自己嘗試解題中..
感謝校長!!!

廖洧杰 iT邦高手 2 級 ‧ 2017-12-10 01:43:30 檢舉

卡關或要幫忙看程式邏輯再 mail 給我哩 ^_^

0
konekoya
iT邦新手 5 級 ‧ 2017-12-11 09:08:13

寫的很好喔!讚

廖洧杰 iT邦高手 2 級 ‧ 2017-12-11 10:41:48 檢舉

感謝 :D

我要留言

立即登入留言