- 已發佈
2022 前端工程師學習指南
- 作者
- 名稱
- Jing-Huang Su
- @Jing19794341
前言
當初在學程式時總是可以在社群找到很多無私分享，這些分享有如引路的明燈般，讓我在茫然時，依然有勇氣繼續往前。希望這篇文章能像明燈般為在相同道路上的人照亮前方的道路。
這篇文章會分享自己從剛開始學程式到現在的知識獲取來源，會分成兩部分，第一部分就是前端相關的學習資源，第二部分則是資訊工程的基礎知識。接下來所分享的學習平台都可以找到品質非常好的課程，並且多數都是免費的，所以在這裡分享給大家！
另外如果是剛開始進入前端的世界且不知道該從哪裡開始下手的讀者們，建議可以先看這個 roadmap，知道大概要學什麼後，在服用本篇提到的資源會更有效。
前端相關
Udemy
如果是剛學的程式的人，找幾門 Udemy 的課程並且認真動手做完課程內所有範例，是足夠能讓你在求職市場上有一定的競爭力。而以下是我當初上完眾多課程後，分享出我覺得學到最多的幾堂課
這門課程基本上就是一個網頁開發的通識課，從最基本的 JavaScript, CSS 到 NodeJS 與部署都會在這門課學習到，非常推薦新手可以從此入門。
想要學 React 與 Redux 這門課是非常好的起始點，此講師講得淺顯易懂，並且會帶很多小專案，讓初學者可以由深入淺的學習。
要學 CSS 看這門課就夠了，其也是由深入淺的方式，課程會有三個專案，如果有認真學習，上完課後你的 CSS 實力會有一定的水準。
想要更深入了解 JS 概念的人不仿可以嘗試這門課！
這門課有點類似第一門課的進階版，使用 MongoDB, Express, React 與 NodeJS 實作出一個 Web App. 非常值得一學。
由於這些課程都是兩年前所學習的，在日新月異的前端領域，這些資訊就請斟酌參考。
Youtube
如果有用 React 就一定聽過 Dan Abramove，而他近期也開了 Youtube 的個人頻道，裡面會放上他在做一些 coding exercies 或是 React 相關的主題。看他的影片可以學習到他思考問題時脈絡以及解決問題的邏輯，此外有時候看他的影片其實蠻下飯的，像是每當看到他在寫 UI 時，都會讓我覺得我的 CSS 程度跟 React 的核心維護者是同個水平！
Brad Traversy 非常佛心，免費公開了不少很有品質的課程，非常適合初學的人跟他一起動手做。
這位講者總是能夠用淺顯易動的方式解釋 React 整體的運作，非常值得一推。
如果在 Leetcode 解題時遇到瓶頸，看了別人的答案還想不為什麼時，NeetCode 總是能夠用循序漸進的方式講解題目，常常聽他講完後會有豁然開朗的感覺。
書籍 & 網站
老手新手皆宜，React 新版的官網，全部的程式範例都是用 React Hook 去實作，看完基本上能掌握 React Hook API 大致的運作。
優質學習平台，也今年三月更新了網站 Layout，裡面有不少很有深度的技術文章，自己三不五時也會從此網站找東西學習。
這個就不用多做介紹了，基本上可以把它當成是前端的 Wiki，有什麼語法或是 JS 觀念的問題，看它就對了！
整本書深入淺出，比起 YDKJS 我更喜歡這本書的解釋，作者用非常淺顯易動的詞彙講解 JS 的觀念，如果有不懂的觀念從這裡找準沒錯！
整本書有三章
第一章: 介紹基本常用的 Design Pattern
第二章: 介紹 Rendering Pattern
此章我認為最精彩的部分，同時也是面試最常被問到的，尤其現在 NextJS 當道，那為何要用 NextJS，而又怎麼從 JQuery，Backbone 時代到 CSR 在到現在的 SSG/SSR 中間的利與弊都在這裡可以看到。
最後一章: 介紹效能優化
Functional Light JS & Mostly Adequate Guide
如果對 Functional Programming 有興趣，看上面兩本書絕對獲益良多，前者提到了所有 FP 基本技巧，也容易在工作中使用，後者則是進入到 Monad 世界，深入探索 FP 的奧妙。
部落客
Dan Abramov 很常在自己的部落格發布讓人為之讚嘆的 React 文章，超讚！
Kent C.Dodds 算是前端社群最活躍的人了，時常可以看到他在社群看到他的教學，而他部落格的文章都能夠用淺顯易動的方式講解 React 的概念。
如果想要知道 Redux 歷史演變，優缺點或是其他 Redux 相關的主題， Mark 的部落格絕對可以解答你的困惑。
訂閱平台
- 訂閱費: 39 鎂 / 月
- 質量: Frontend Master 的質量不用多說，整體是非常不錯的，很常會有開源的核心貢獻者開課，課程長度中長且扎實。
- 廣度: 前端相關的課程居多。
- 評價: 自己訂閱一年多，整體來說 Frontend Master 上面有許多不錯的課，像是 YDKJS 的作者 親自教授 JS 概念又或是 Brian Lonsdorf 所開設的 Functional Programming 都是值得五星吹捧的。但訂閱費偏貴以及課程更新頻率稍微漫長，比較適合中老手短期想要精進某項技術，並且不太適合長期訂閱。
- 訂閱費: 12.5 鎂 / 月
- 質量: 質量參差不齊，有些課令人讚嘆，有些則是看不到一節就想要關掉，CP 值中等，內容短很適合平日下班進修。
- 廣度: 前端相關的課程居多。
- 評價: 自己訂閱一年多，但完整看完的課程卻少之又少，多數都是完不到一節就關掉了。
- 訂閱費: 12.99 鎂 / 月
- 質量: 有許多質量不錯的書，近期下班的進修讀物都是從上面找。
- 廣度: 從前端到資料庫應有盡有，而且都還蠻新的。
- 評價: 自己從今年一月開始訂，目前持續訂閱中，使用下來算是值得五星吹捧的平台。
資訊工程相關
Mindset
以下是自己覺得必學的 CS 基礎課程，儘管這些課程不像是仿間或上面提到的 bootcamp 會讓你快速有成品，但這就是最基礎的 CS 學科，基本上所有應用就是建築在這些基礎上的變化，知道這些概念會可以使你加快理解新的應用，雖然短期可能沒辦法看到實質幫助，但長期下來花時間學習絕對有益無害。自己也還沒有全部學完，也會在未來加緊腳步努力補強！
因為而個人偏愛教授在課堂所錄製的影片，所以主要都是從教授的個人網頁去找，而非 coursera 或 edX。
尋找課程的方式
想當初在大學時，什麼都沒有就是時間最多，所以很常在空閒時在網路上挖寶，也讓自己有了找 OCW 的 SOP
- 閒暇時間搜尋各 CS 名校教授的網頁
- 看是否有公開的課程材料(Video/Lab/HW)
- 透過 Rate My Professors 看該教授評價
- 試聽一堂，覺得是自己喜歡的就會收錄到待學清單。
Note
如果不想這麼麻煩，MIT 跟 UCSD 也有提供該校 CS 的完整課程
MIT 是 OCW 的先驅，裡面的課程是最齊全的並且內容也很豐富，但自己不太習慣 MIT 的教學方式，可能是自己資質愚昧，與教授講課的頻率真的對不太上，而課程作業也是偏論述題居多。
UCSD 也是提供了很完整的 CS 課程，此網站雖然只有提供課程側錄，但課程網站基本上都可以用
${課程季度} UCSD ${課程代碼} Google Sites, (e.g. winter 2022 UCSD CSE 110 Google Sites) 在 Google 搜尋到。
如果想要上一系列同一大學所開的課程，其實這兩個就已經是很棒的選擇了！
基礎
離散數學 & 機率
其實離散數學跟機率在網路上的資源都不太好找，如果找到評價也都不是太好，但目前有找到兩堂是還不錯的。
離散數學 - Clemson - Math4190
這位老師在自己的網站上釋出了許多數學相關的課程，並且該課在 ratemyprofessors.com 拿到很不錯的分數，推薦給大家！
機率 - Stanford - CS109 / UCB - Prob140
這堂課是 Stanford Chris Piech 教授開的課程，教學非常生動，整體下來是一個非常不錯的課程，建議可以搭配 UC Berkeley Prob 140 教科書一起服用，理論實作一網打盡。讚拉！
程式基礎
CS61 系列 - UCB - CS61A(John DeNero) / UCB - CS61B(Josh Hug)
沒錯，這就是我在之前提到的神之課程，這兩門課程都是 UC Berkeley 開的課程，前者是教程式的基本概念，後者則是教資料結構跟一點軟體工程。兩門課程的教授都很會教也非常有啟發性，是讓我不知不覺愛上程式的兩門課程。也強烈建議時間允許的話，將課程提供的教材都做過一遍，超推！
其他熱門 - Harvard - CS50 / Stanford - CS106A / Stanford - CS106B
雖然 CS61 系列已經講得夠好了，但說不定有人覺得並不對味，所以列出了這三堂聲量不輸 CS61 的課程，可以嘗試看看！
演算法
理論型演算法 - UCB - CS170 / Stanford - Tim Roughgarden / Harvard - Jelani Nelson
學完 CS61B 之後，還念念不忘的話並且想要在對演算法有更深入的了解可以繼續上這幾門課
進階
以下推薦的都是我完全沒有看過，但是未來計畫看的課程。
資料庫
計組/計結
據說這是 CMU 的神課之一，不論是用書 CSAPP 以及其 LAB 都是廣受好評。
這門課也是評價很好的課程，只是教授口音稍微重一點，給大家參考看看。
Operating Systems: Three Easy Pieces 的作者，聽說這本書是神書，而且教授的評價也非常好，我想一定是非常不錯的一門課。
其他
網路概論 - UMass - CS453
目前上完前兩章，教授非常讚，也教得很仔細，而參考書就是教授本人自己寫的 Computer Networking: A Top-Down Approach。
網路安全 - Stanford - CS253
對於前端工程師必學的一門課，裡面涵蓋著經典的前後端常見的駭客攻擊手法，是我 2021 年最愛的一門課。
Programming Language - U of Utah - CS3520
這門課教授也是評價非常高的教授，筆者對於 Functional Programming 也很有興趣，所以可能是 2022 最想完成的課程之一。
結論
學海無涯，一起加油！
如果有任何問題或內容有錯誤，可以透過 Email 聯繫我，我會盡快回覆或更正，如果覺得這篇文章對你幫助可以透過下方 "Buy Me a Coffee" 的連結請筆者喝一杯咖啡！