Coder Social home page Coder Social logo

mentor-program-3rd's Introduction

程式導師實驗計畫第三期

這是什麼

程式導師實驗計畫第三期是一個為期六個月的計畫,要求學生付出一定的時間(每週至少付出四十小時),希望能在結業時培養出合格的(意思就是找得到工作)的工程師,並且在就職後依舊能持續成長,成為好的工程師。

課程目標

核心能力

  1. 具有找資料的能力,能夠知道如何找到相關資訊
  2. 具有分析問題的能力,能夠快速定位問題
  3. 知道如何解決問題,包括但不限於拆解問題、簡化問題、轉化問題
  4. 解決問題後能夠重新歸納並整理

工具能力

  1. 後端:知道後端原理,知道什麼是資料庫、Server,可以寫出簡單的網站並且自己部署
  2. 前端:知道前端原理,HTML、CSS、JavaScript,知道 Ajax 以及如何與後端串接
  3. 資安:基本資安概念,SQL Injection、XSS、CSRF

課程規則

1. 每日進度報告

為了更方便追蹤大家的進度,必須在禮拜一到五每一天簡短報告自己今天學了什麼和碰到什麼問題(已解決或未解決),除了作為淘汰制的參考以外,其實也是幫自己簡單複習一下所學過的東西。

進度報告你可以選擇早上 po 或是晚上 po,早上的話就是講昨天的事,晚上的話就是講今天的。

2. 每日心得(鼓勵但非強迫)

之前我有寫過一篇文章叫做《每一篇心得都有價值——為什麼初學者才更應該要寫心得筆記》,裡面跟大家稍微講了一下寫心得的好處,在這課程中我也希望能把這個習慣帶給大家。

每天寫心得真的不是件容易的事,連我自己都做不太到,因此這一項是「鼓勵非強迫」,你沒有做到也沒關係,但我希望至少能夠每個禮拜寫個兩三篇,重點其實是在連續,這樣才有完整的紀錄可以看。

心得內容其實要寫什麼都行,沒有強迫,你簡單寫三個字:「我好累」或是「收穫多」也都可以,當日記在寫就好,我之前就先示範了每日筆記,記錄一些教學上的思考。

若是你不知道心得該如何下手,這邊推薦一個不錯的模板叫做 ORID 筆記,每天根據這四項來寫:

Objective 客觀

關於今天的課程,你記得什麼?
完成了什麼?

Reflective 感受

你要如何形容今天的情緒
今天的高峰是什麼?
今天的低點是什麼?

Interpretive 解釋反思

我們今天學到了什麼?
今天一個重要的領悟是什麼?

Decisional 決定行動

我們會如何用一句話形容今天的工作?
有哪些工作需要明天繼續努力?

有了基本架構之後會容易很多,你只要根據提供的問題模板去思考就行了。

細節可參考:初探 ORID 焦點討論法如何使用ORID总结学习,加快进步?

3. 交作業前先檢查

身為工程師,在交付產品以前自己有義務先做一些基本的測試,至少不要出現一打開就掛掉或者是 UI 差超級多這種狀況。交作業也是一樣的,如果你的作業連範例附的簡單 測試都跑不過,或者是基本功能都沒完成,那我也不知道我要改什麼。

所以,在交作業前請先自己檢查一下,如果品質太差的我會直接退件。

4. 簡答題規範

注意,簡答題不像你以前學生時期做報告那樣可以直接複製貼上,這是最沒有用的答題方法。我希望的是你找資料閱讀,吸收並理解以後再用自己的文字寫出來,這樣的理解程度會高很多,而不是複製貼上就了事。若是只會複製貼上,我保證一個月後我再問你同樣的問題,你也答不出來。

如果真的寫不出來,可以試著看著相關資料自己照著重打,這樣也會加深記憶。

有任何查到的相關資料都可以一併附上,第一是給別人一個 credit,可以讓作者知道他的文章對你有幫助,第二也是給自己留一個筆記,之後忘記可以再回來這邊找。

5. 程式碼規範

第三期首次導入 eslint,幫整個專案都裝了 eslint,每一次 commit 都會自動檢查 JavaScript 的程式碼,有違反規則的話需要修正以後才能 commit。從第一週開始就強迫大家養成良好的程式碼撰寫習慣。

其他

  1. 第十三週以前禁止使用 jQuery(除非你原生的 DOM API 真的很熟了)

課程進行方式

本期進行方式與前兩期差異頗大,這期「原則上完全沒有直播」,課程以線上影片為主,全部課程內容皆為預錄好的線上影片(無字幕)。

每一週都會有指定教材以及導讀影片,若有需要的話可以自行尋找其他資源學習。

還有一點請特別注意,沒教的內容也可能出現在作業裡,不要被當期的內容給迷惑了,以為一定要用當週教的東西來解題。

課程大綱

從 2019/04/15 至 2019/10/15 ,為期六個月的課程,一共約二十六週。每週的開始為禮拜一,結束為禮拜日。

第一週(04/15 ~ 04/21):暖身週

大致介紹整個計畫以及帶學生看過一次課程大綱,接著說明整體架構,介紹各種不同工程師職位所負責的工作內容並著重在網頁工程師的介紹,並說明課程進行方式。

除此之外,也會帶大家看一下學習的方法並推薦相關課程,為之後的課程做好準備。

Mindset 建立:

  1. 不要害怕問問題,每個問題都值得被提出來,你的問題可能也是其他人的問題
  2. 問問題前應該要自己查詢資料(有些很難查的直接問也可以)
  3. 你有老師讓你盡量問,反正問就對了,有錯的話我會提醒你
  4. 重點是「目的」,而不是「手段」,持續問為什麼為什麼為什麼為什麼
  5. 學程式需要換一個思維模式

建置基礎環境,例如說 Command Line Tool 與 Git,以及學會如何交作業。

指定教材:

  1. [CMD101] Command Line 超新手入門:全部
  2. [GIT101] Git 超新手入門:全部
  3. [CS101] 初心者的計概與 coding 火球術:1-1 ~ 2-4、4-1、4-2、11
  4. 程式導師實驗計畫第二期:Lesson 1-1(可以快轉忽略與第二期本身相關的部分)

HW1 作業連結

自我檢測

  • 你說得出程式如何執行
  • 你理解寫程式的本質只是一行行的指令
  • 你了解前端與後端的區別
  • 你能說出從發出一個 request 到接收 response 中間發生的事
  • 你了解不同載具的差異在哪(Desktop、Mobile、Web)
  • 你了解基本的 command line 指令
  • 你知道 Git 在做什麼,以及為何我們需要 Git
  • 你知道 add、commit、push、pull 等基本 Git 指令
  • 你知道怎麼使用 branch 並送出 Pull Request
  • 你熟悉 Git Workflow(其實就是交作業的流程)

第二週(04/22 ~ 04/28):程式基礎(上)

前四週其實是這個計畫最重要的一個月,希望能在這四週讓學生把基礎打得相對紮實,這樣比較好應付之後的課程。

這一週的學習目標是程式基礎,包括但不限於:變數、陣列、迴圈、判斷式以及函式(以 ES5 為例)。

必須要強迫自己轉換成寫程式的思考模式,否則這一週對你來說會是惡夢。對於從來沒有接觸過類似思考模式的人可能會需要點時間,但只要慢慢練習,就會越來越進入狀況。

還有一點請大家注意,程式是按照你寫的跑,不是按照你想的跑。當程式執行結果超出預期時,console.log是你的好朋友,可以把東西印出來看看是不是跟你想的一樣。

最後,在這週也會講到 eslint,我已經幫大家設置好了 eslint,這是一個能夠幫你自動做語法檢查的工具,在每次 commit 之前都會自動檢查程式碼的規範,不符合規範的話不會讓你 commit。

指定教材:

  1. [JS101] 用 JavaScript 一步步打造程式基礎:開頭到綜合練習 Lv1

進階閱讀:

  1. [CS101] 初心者的計概與 coding 火球術:7-1~7-4

HW2 作業連結

自我檢測:

  • 你能靈活運用變數、迴圈、判斷式等等基本概念來解題
  • 你能一行行的說出現在程式在做什麼
  • 你知道「回傳」跟「輸出」的差異
  • 你可以把用文字寫好的演算法轉成程式碼

第三週(04/29 ~ 05/05):程式基礎(下)

在程式基礎的部分一週是絕對不夠的,因此本週會繼續加強程式基礎。在這一週裡面我們會延伸上一週的內容,並且多講一些有關於 ES6 的語法。

像是介紹常用內建函式如 replace、indexOf、split、map、filter、join、parseInt 以及 Math 等等。

也會教大家寫簡單的 unit test,並且自己寫 test case 檢驗自己的函式。

本週的作業有自動批改系統,請傳到 Lidemy OJ 上,並且確認每一題都有答對之後再交作業,否則我會直接退件(hw5 除外,因為這題比較難,沒有通過依然可以先交作業)。

HW3 作業連結

指定教材:

  1. [JS101] 用 JavaScript 一步步打造程式基礎:全部
  2. [JS102] 升級你的 JavaScript 技能:ES6 + npm + Jest:全部

上一期相關部分:

  1. 程式導師實驗計畫第二期:Week2 加強 JavaScript
  2. 程式導師實驗計畫第二期:Week2 - ES6

寫完作業以後才能看:

  1. 程式導師實驗計畫第二期:Week3 - 第二週作業檢討

自我檢測

  • 你理解常用內建函式如何使用
  • 你熟悉程式語法並知道如何解決基礎問題
  • 你知道為什麼我們需要 unit test
  • 你知道什麼是 unit test
  • 你知道如何寫 unit test
  • 你知道如何測試一個 function

第四週(05/06 ~ 05/12):網路基礎

無論是前端還是後端,身為一個網頁工程師,你必須很清楚整個網路運作的輪廓。細節你可以日後再研究,但一定要能掌握大方向以及重要概念,否則你未來的路絕對會走得很崎嶇。

在這週裡面我們會學到兩台電腦在網路上該怎麼溝通,從上層往下,再從底層往上,一步步建立起你對網路的世界觀。

當然,只有理解是不夠的,我們也會用 Node.js 讓你實作簡單的網路爬蟲以及串接基本的 API,帶你熟練與網路相關的知識。

HW4 作業連結

指定教材:

  1. [NET101] 網路基礎概論(搭配 JS 實作練習):全部
  2. [CS101] 初心者的計概與 coding 火球術:4-1 ~ 4-4
  3. 從拉麵店的販賣機理解什麼是 API

自我檢測

  • 你知道網路背後大概的運作模式
  • 你知道什麼是 Request 跟 Response
  • 你知道什麼是 DNS 以及運作原理
  • 你知道 HTTP 與 HTTPS 的差異
  • 你知道 localhost 跟 127.0.0.1 是什麼
  • 你知道 GET 與 POST 的差別
  • 你知道常用的 HTTP Header
  • 你知道什麼是 API
  • 你會使用 node.js 寫出串接 API 的程式
  • 你知道 HTTP method 有哪些
  • 你知道基本的 HTTP statud code,像是 200、301、400、404、500

第五週(05/13 ~ 05/19):複習週

經過前面四週的各種摧殘,終於迎來了第一次的複習週!

複習週顧名思義,就讓大家複習前面這四週的進度用的,這四週我們一共學了四項主要的技能:

  1. Command line 的使用
  2. Git 的基本操作
  3. JavaScript 基本語法及程式思維
  4. 網路基本概念

如果你之前因為趕時間亂寫而亂寫作業,現在是回去重新省視一遍的好時機;或者是之前有查到什麼有趣的延伸資料但沒時間看的,這一週你就有時間看了。

在複習週是沒有任何進度的,但是會有兩個小挑戰,讓你們檢驗自己前面學到的技能。

HTTP Game

為了檢驗你對於 API 串接是否理解,我特地做了一個很有趣的小遊戲:Lidemy HTTP Challenge

建議使用之前教過的 node.js 搭配 request 這個 library 來解題,才能比較有效確認自己是否前面都有學進去。

我有藏了一些很無聊的梗在裡面,解題的時候可以順便找找。

NPSC 題目練習

NPSC 中文全名為網際網路程式設計全國大賽,是台大每年都會辦給國中生跟高中生參加的比賽。

裡面很多題目都很有趣,適合拿來給程式初學者練習,我特地找了一些比較簡單的題目,大家可以用來檢驗自己的程式基礎是否紮實:Lidemy OJ

HW5 作業連結

第六週(05/20 ~ 05/26):前端基礎(一)

本週將會正式進入到前端課程的領域,開始用 HTML 與 CSS 打造出基本的網頁,並且利用 media query 實現簡單的 RWD(Responsive Web Design)。

HTML 的部分就簡單帶過幾個常見的 tag,帶到 head 的一些屬性跟設定,也會講到跟 SEO 有關的一些 tag(title, description, json ld...)。

主要會著重在 CSS 的部分,並且讓大家多多練習。

也可以先看一下這兩篇文章(很多地方你會看不懂,但沒關係)先培養一下對前端的感覺,等幾週過後當我們學得越來越多,再看一次會有完全不同的感受:零基礎的小明要如何成為前端工程師?跟著小明一起搞懂技術名詞:MVC、SPA 與 SSR

指定教材:

  1. [FE101] 前端基礎:HTML 與 CSS:全部
  2. 程式導師實驗計畫第二期:Week3-2 - CSS
  3. Chrome 網頁除錯功能大解密

寫完作業才能看:

  1. 程式導師實驗計畫第二期:Week4-1 - 上週作業檢討

HW6 作業連結

自我檢測

  • 你知道 HTML 是在做什麼的
  • 你知道如何使用有語意的(semantic)標籤
  • 你知道基本 SEO 的概念
  • 你知道 CSS 是什麼
  • 你知道 inline、block 跟 inline-block 的區別
  • 你知道什麼是 box model
  • 你知道 position 的所有屬性及其差別
  • 你知道 :hover, :before, :after
  • 你知道 :nth-child 的各種用法
  • 你熟悉 CSS selector,可以輕鬆選到想選到的元素

第七週(05/27 ~ 06/02):前端基礎(二)

這一週將會進入到 JavaScript,讓網頁變得有互動性,並結合 <form> 做表單驗證,以及讓大家寫出簡單的網頁應用程式。

這會是我們第一次把 JavaScript 應用在網頁上,來學習怎麼使用 JavaScript 操控 DOM 物件,讓網頁動起來。

指定教材:

  1. [FE102] 前端必備:JavaScript:到 ajax 之前
  2. 程式導師實驗計畫第二期:Week4-2 - JavaScript

指定閱讀:

  1. DOM 的事件傳遞機制:捕獲與冒泡

HW7 作業連結

自我檢測

  • 你知道 JavaScript 跑在網頁上跟跑在 Node.js 上差在哪裡
  • 你知道 DOM 是什麼
  • 你知道如何用 JavaScript 操控 DOM 物件
  • 你知道如何幫一個按鈕加上 event listener
  • 你知道捕獲與冒泡是什麼
  • 你知道什麼是事件代理(delegation)
  • 你知道怎麼用 JavaScript 更改元素的 style
  • 你知道 preventDefault 與 stopPropagation 的差異

第八週(06/03 ~ 06/09):前端基礎(三)

之前在第四週時有提過 API,也有讓大家試著用 node.js 寫些小程式來串接。

而前端當然也能串接 API,理解前後端如何串接是很重要的一部分,因此這週會花滿多心力再來講 API 串接,讓大家複習一下 API 的概念,並且教大家什麼是 Ajax。

指定教材:

  1. [FE102] 前端必備:JavaScript:ajax 以後

寫完作業才能看:

  1. 從假資料到真資料:Ajax 與 API 串接

相關學習資源:

  1. 輕鬆理解 Ajax 與跨來源請求
  2. RESTful API Design by TritonHo

HW8 作業連結

自我檢測

  • 你知道什麼是 API
  • 你知道什麼是 Ajax
  • 你知道從網頁前端呼叫 API 與在自己電腦上寫程式呼叫的差異
  • 你知道什麼是同源政策(Same-origin policy)
  • 你知道如何存取跨網域的資源(CORS)
  • 你知道什麼是 JSON
  • 你知道什麼是 JSONP 及其原理
  • 你知道 Fetch 的基本使用方法

第九週(06/10 ~ 06/16):後端基礎(一)

前端基礎打得差不多以後,就要進入後端的課程,這次課程會以 PHP 為主要的語言,Node.js 為輔助。

這週的課程會講解 PHP 基本觀念、語法,並且教大家安裝設定 MySQL,寫出簡單的 CRUD 應用。

指定教材(學習順序請參考 Lidemy.com 上的說明):

  1. 程式導師實驗計畫:Lesson 5-1 之後端基礎
  2. 程式導師實驗計畫:Lesson 5-2 之資料庫
  3. [CS101] 初心者的計概與 coding 火球術:5-3
  4. [BE101] 用 PHP 與 MySQL 學習後端基礎:全部
  5. 程式導師實驗計畫第二期:Week5-2:物件導向程式設計
  6. Week5 物件導向(續):繼承與 static

上一期相關內容:

  1. 程式導師實驗計畫第二期:Week5 - 後端基礎

物件導向相關閱讀:

  1. http://expect7.pixnet.net/blog/post/38682120
  2. https://noob.tw/java-oop/
  3. https://blog.miniasp.com/post/2009/08/27/OOP-Basis-What-is-class-and-object.aspx
  4. http://blog.turn.tw/?p=3093
  5. https://www.ptt.cc/bbs/OOAD/M.1256403807.A.8AE.html

如果作業寫不出來,可參考:

  1. 程式導師實驗計畫第二期:Week10-1 PHP 簡易會員系統 + 留言板
  2. 程式導師實驗計畫:Lesson 6-1 之 live coding
  3. 程式導師實驗計畫:Lesson 5-3 之作業檢討

相關學習資源:

  1. 第一正規化(First Normal Form, 1NF)

HW9 作業連結

自我檢測

  • 你知道 PHP 是什麼
  • 你知道前端與後端的差別
  • 你知道什麼是資料庫
  • 你了解基本的 SQL 語法,包括 Select、Insert Into、Delete 與 Update
  • 你能夠寫出基本到 CRUD 應用

第十週(06/17 ~ 06/23):複習週

這是第二次的複習週,在前四週我們一共學了:

  1. HTML 與 CSS
  2. DOM 以及 JavaScript 如何與網頁互動
  3. 前端利用 Ajax 與後端串接
  4. PHP 與 MySQL

這一週可以讓你有時間好好複習之前的內容,若是覺得都 ok 了,也可以試試看之前的進階挑戰題、挑戰題以及超級挑戰。

這次跟第五週一樣,怕大家太無聊,於是準備了兩個有趣的小遊戲給大家玩。

綜合能力測驗

這邊有一份參考某間公司面試考題的綜合能力測驗,還滿有趣的,主要是測前幾週的整合能力。

如果你點進去看到一片白畫面,那或許不代表網頁壞了。

闖關遊戲

一共十關,看你能闖到第幾關:r3:0 異世界網站挑戰(特別感謝 @minw 製作遊戲)。

HW10 作業連結

第十一週(06/24 ~ 06/30):後端基礎(二)

接下來幾週都會以之前的留言板作為主軸,一步步加強它,使它成為一個比較完整的產品。

在這過程中你會學到許多新的後端概念,也會幫留言板加上更多更多的新功能!

指定教材(學習順序請參考 Lidemy.com 上的說明):

  1. [BE101] 用 PHP 與 MySQL 學習後端基礎:全部
  2. [CS101] 初心者的計概與 coding 火球術:4-3、5-4

HW11 作業連結

自我檢測

  • 你知道什麼是雜湊(Hash function)
  • 你知道什麼是加密(Encryption)
  • 你知道雜湊與加密的差別
  • 你知道什麼是 Session
  • 你知道什麼是 Cookie
  • 你知道 Cookie、Local Storage 與 Session Storage 的差別
  • 你知道 Session 與 Cookie 的差別

第十二週(07/01 ~ 07/07):後端基礎(三)

這一週我們要強調一個很重要的觀念:資訊安全。

無論你是前端還是後端,都必須時時刻刻在心裡惦記著資訊安全的概念,總結為一句話就是:「不要相信任何來自 client 端的資料」,只要能做到這點,其實就可以阻止掉很多的惡意攻擊。

指定教材(學習順序請參考 Lidemy.com 上的說明):

  1. [BE101] 用 PHP 與 MySQL 學習後端基礎:全部
  2. 程式導師實驗計畫:Lesson 6-2 之 Web Security
  3. 程式導師實驗計畫:Lesson 6-3 之 HW6 作業檢討
  4. 程式導師實驗計畫第二期:Week6-1:後端基礎(中)
  5. 程式導師實驗計畫第二期:Week6-2:資訊安全
  6. [CS101] 初心者的計概與 coding 火球術:5-5

若是作業寫不出來:

  1. 程式導師實驗計畫第二期:Week10-2 會員系統安全加強 + 兩層留言板
  2. 程式導師實驗計畫第二期:Week11-1 資訊安全加強

延伸閱讀:

  1. 讓我們來談談 CSRF

HW12 作業連結

自我檢測

  • 你知道什麼是 SQL Injection 以及如何防範
  • 你知道什麼是 XSS 以及如何防範
  • 你知道什麼是 CSRF 以及如何防範
  • 你知道為什麼儘管前端做了驗證,後端還是要再做一次驗證

第十三週(07/08 ~ 07/14):前端基礎(四)

首先帶大家串接之前自己寫出來的 API,把前端介面用 Ajax 改寫,使網頁互動性變得更高。讓大家熟悉 jQuery,把現有應用用 jQuery 改寫一次。

版面的部分則利用 Bootstrap 搭配 Bootswatch 讓介面變得美觀。利用網格系統實作 RWD。

除了這些呢,也會幫大家補充 Promise 的一些用法。

指定教材:

  1. 程式導師實驗計畫第二期:Week7-1 前端基礎(下)
  2. 程式導師實驗計畫第二期:Week7-2 Fetch & Promise
  3. 程式導師實驗計畫:Lesson 7-1 之 jQuery 與 Bootstrap
  4. 程式導師實驗計畫:Lesson 7-2 之 jQuery Bootstrap 實戰應用

作業寫不出來可參考:

  1. 程式導師實驗計畫第二期:Week11-2 改寫 Ajax

HW13 作業連結

自我檢測

  • 你知道 jQuery 是做什麼的
  • 你知道 jQuery 與 vanilla js 的差別
  • 你知道用 Ajax 去 call API 與伺服器直接輸出資料的差別
  • 你知道如何與自己寫的 API 串接
  • 你知道什麼是 Bootstrap
  • 你知道 Bootstrap 原理及如何應用
  • 你知道什麼是網格系統以及如何應用在 RWD
  • 你知道什麼是 Promise
  • 你知道 Promise 的三種狀態

第十四週(07/15 ~ 07/21):後端基礎(四)

有了自己的前後端程式之後,就可以開始來部署了。這週的重點會放在帶大家直接去買主機(AWS、Digital Ocean、Linode),並且了解如何連上主機。

也會讓大家購買自己的網域,理解如何將網域以及主機串連起來,讓大家可以連線到你的網站。

在這個章節也會讓大家理解後端基本架構(NAT、Load balancer、DB replication 等等)

最後也會補齊跟資料庫的一些知識,像是 ACID、Transaction、View 以及 Stored procedure。

這週也要特別感謝 gandi 連續三期全額贊助了網域的費用 <(_ _)>。

指定教材(學習順序請參考 Lidemy.com 上的說明):

  1. 程式導師實驗計畫:Lesson 8-2 之資料庫
  2. 程式導師實驗計畫第二期:Week8-1 後端基礎(下)
  3. 程式導師實驗計畫:Lesson 8-1 之後端基礎與網路相關知識
  4. 程式導師實驗計畫:Lesson 8-3 之 hw8 作業檢討
  5. 程式導師實驗計畫第二期:Week9-1 基礎到中階

推薦閱讀:

  1. 部署 AWS EC2 遠端主機 + Ubuntu LAMP 環境 + phpmyadmin
  2. 一小時完成 VPS (Virtual Private Server) 部署
  3. 如何遠端連接虛擬主機上的 mySQL 資料庫 ?

相關學習資源:

  1. MySQL 超新手入門(11)Views
  2. MySQL Views
  3. MySQL 超新手入門(13)Stored Routines 入門
  4. 只要說「我要下午茶!」——什麼是資料庫預存程序?
  5. MySQL Stored Procedure
  6. MySQL 超新手入門(16)Triggers
  7. MySQL Triggers
  8. 跟 Trigger 與 View 相關的簡報 by TritonHo
  9. 跟 ACID 有關的簡報 by TritonHo
  10. MySQL CREATE INDEX
  11. Stored procedure 相關討論:討論一討論二討論三討論四

HW14 作業連結

自我檢測

  • 你知道虛擬空間、虛擬主機以及實體主機的差別
  • 你知道什麼是網域(Domain)
  • 你知道如何設定網域(A、CNAME)
  • 你知道如何用 SSH 遠端連線到自己的主機
  • 你知道如何部署應用程式
  • 你知道什麼是 No SQL
  • 你知道什麼是 Transaction 與 lock
  • 你知道資料庫的 ACID 是什麼
  • 你知道什麼是資料庫的 View 以及使用時機
  • 你知道什麼是 Stored procedure 以及如何使用
  • 你知道資料庫的 Trigger 以及使用時機

第十五週(07/22 ~ 07/28):複習週

終於到了第三次的複習週,這次要複習的東西比以往都多了點:

  1. Session 與 Cookie 的差異
  2. 資訊安全(Hashing, SQL Injection, XSS)
  3. jQuery
  4. Bootstrap
  5. Promise
  6. 部署

這次提供三個跟資訊安全相關的練習網站,都跟我們以前複習週的模式差不多,可以一直闖關:

  1. https://xss-game.appspot.com([解題影片,有雷](https://www.youtube.com/watch?v=MMMkvHwqPRY))
  2. http://www.hackertest.net/
  3. http://xss-quiz.int21h.jp/ (這個可能會被 Chrome 擋下來...可以用 Firefox 或是其他網站玩)

祝大家玩得開心!

另外,這一週的作業除了心得以外,也提供了一個跟以往不太一樣的測驗:網站前後端開發基礎測試,一共十題簡答題,Google 表單在送出之後可以看見參考解答,能夠自己對答案。

HW15 作業連結

第十六週(07/29 ~ 08/04):前端中階(上)

這週的東西比較分散一些,我們會著重在三個部分:

1.CSS 預處理器

在被 CSS 折磨這麼久之後,終於有機會用程式化的方法來撰寫 CSS,這週將介紹幾個不同的 CSS preprocessor(LESS, SASS, Stylus),讓學生自行選擇看順眼的並且練習,把之前的 CSS 都改寫。

2.基本資料結構

這週會介紹到基本的資料結構 stack 與 queue 與 JavaScript 的物件導向。

3.什麼是快取(Cache)?

快取對工程師來說是一定要理解的概念,前端有前端的快取,後端也有後端的。這週主要會著重在前端快取的介紹上。

指定教材(學習順序請參考 Lidemy.com 上的說明):

  1. 程式導師實驗計畫:Lesson 9-1 之 CSS 預處理器
  2. 程式導師實驗計畫:Lesson 9-2 之資料結構、Cache 與 Event Loop
  3. 程式導師實驗計畫:Lesson 9-3 之作業檢討
  4. 程式導師實驗計畫第二期:Week9-1 基礎到中階
  5. 程式導師實驗計畫第二期:Week9-2 JavaScript 執行原理

HW16 作業連結

自我檢測

  • 你知道什麼是 Cache
  • 你知道 HTTP Cache 的原理以及相關 Header
  • 你了解 CSS 預處理器的目的以及原理
  • 你知道什麼是 Stack
  • 你知道什麼是 Queue
  • 你可以用 JavaScript 實作出 Stack 跟 Queue
  • 你知道 CSS Selector 權重的計算方式

第十七週(08/05 ~ 08/11):前端中階(中)

本週主要會放在 JavaScript 的一些重要基礎以及瀏覽器運作時的機制。

第一個重點是瀏覽器在運行 JavaScript 時的 Event Loop 機制。

第二個重點就是 JavaScript 的一些重要基礎,包含:scope、hoisting、closure、prototype、this 等等。

指定教材:

  1. 程式導師實驗計畫第二期:Week9-2 JavaScript 執行原理
  2. [JS201] 進階 JavaScript:那些你一直搞不懂的地方
  3. What the heck is the event loop anyway? | Philip Roberts | JSConf EU

HW17 作業連結

自我檢測

  • 你知道 Event Loop 的運作方式
  • 你知道什麼是作用域(Scope)
  • 你知道 Hoisting(提升)是什麼
  • 你知道 Hoisting 的原理為何
  • 你知道 Closure(閉包)是什麼
  • 你能夠舉出一個運用 Closure 的例子
  • 你知道 Prototype 在 JavaScript 裡是什麼
  • 你知道大部分情況下 this 的值是什麼

第十八週(08/12 ~ 08/18):前端中階(下)

這週將學習把工作自動化,利用 gulp 管理工作流程,避免繁瑣的手動操作。

也會講到 Webpack 誕生的理由以及模組化的 JavaScript 開發,讓學生理解為何需要使用 Webpack。

除此之外也會講到一些與 CSS 相關的優化小技巧,例如說針對圖片做優化的 CSS Sprites 或是 Data URI,或是 JavaScript 與 CSS 的 uglify、minify 等等。

最後也會用跟以往不太一樣的模式,做出一個簡單的 todo list。

指定教材:

  1. 程式導師實驗計畫:Lesson 10-1 之 gulp 與 webpack (注意,影片裡面教的是舊版的 Gulp 與 Webpack,學概念就好,實作請參考其他教學或是官方文件)

寫完作業可參考:

  1. 程式導師實驗計畫:Lesson 10-2 之 HW10 作業檢討

HW18 作業連結

自我檢測

  • 你知道 gulp 的目的以及原理
  • 你知道 webpack 的目的以及原理
  • 你熟悉如何使用 webpack 進行模組化開發
  • 你熟悉如何使用 gulp 建構自動化工作流程
  • 你能夠快速打造出基礎環境
  • 你知道 CSS 優化的一些小技巧
  • 你知道 CSS Sprites 與 Data URI 的優缺點
  • 你知道什麼是 uglify 與 minify

第十九週(08/19 ~ 08/25):網路基礎複習

學到這週為止,前後端的概念你應該滿清楚了,我們也學了不少東西,下一週是複習週,再下一週就要正式進入前後端框架的領域了。

在進入到那邊以前,我們還要來複習一些東西並且加強基礎。

我們首先要加強的第一個東西是複習前面教的網路基礎,你必須對前後端溝通的每一個流程都很確定,在之後的單元中才不會迷失自我。

接著要來講的是 SPA,還記得之前貼給你們看過的那兩篇文章嗎?零基礎的小明要如何成為前端工程師?跟著小明一起搞懂技術名詞:MVC、SPA 與 SSR,這週的重點會放在這兩篇文章上面,讓大家清楚知道背後的概念為何。

指定教材:

  1. 複習第四週網路概念:CS75 (Summer 2012) Lecture 0 HTTP Harvard Web Development David Malan
  2. 複習第十四週系統架構:CS75 (Summer 2012) Lecture 9 Scalability Harvard Web Development David Malan

HW19 作業連結

自我檢測

  • 你知道什麼是 SPA
  • 你知道後端 MVC 與前端 MVC 的差異
  • 你知道前端路由與後端路由的差異

第二十週(08/26 ~ 09/01):複習週

這是最後一次的複習週了,在前幾週我們一共學了:

  1. CSS 預處理器
  2. 基本資料結構
  3. HTTP Cache
  4. JavaScript 觀念:scope、hoisting、closure、prototype、this
  5. Event Loop
  6. Gulp 與 Webpack
  7. 網頁圖片優化

至此,這個課程的基礎跟中階都學完了,從下週開始就要進入到前後端框架的領域。

為了怕大家複習週太無聊,這次也準備了一個有趣的小測驗,Lazy Hackathon 是一個速度很慢的網站,原因有很多,原始碼在這裡:https://github.com/Lidemy/lazy-hackathon (特別感謝 @yakim-shu 同學製作這個小測驗)

現在呢,你要來負責優化這個網站,在「不動內容」的情形下來調整,意思就是說網頁看起來要「長得一模一樣」,把圖片變黑白、刪減文字或是更動排版都是不允許的,但刪減多餘的 HTML、CSS 和 JS 是 ok 的,只要保證網頁看起來一樣就行了,原始碼怎麼動隨便你,總之目標是使網站的載入速度變快。

詳細說明請參考上面的原始碼連結。

若是你沒有任何靈感,可參考 web.dev 或是 Website Performance Optimization

HW20 作業連結

第二十一週(09/02 ~ 09/08):前後端框架(一)

後端框架(一)

這一週終於正式進入後端框架的領域了!

之前我們學過了原生的 PHP,而這一週呢,你要來自學一個輕量的 PHP 框架 CodeIgniter

相信大家之前在寫留言板的時候,寫到後面會發現自己的程式碼愈來愈亂,而且不知道怎麼整理。框架就是解決這個問題的方法之一,因為它已經制定了一系列的規範,你只要學習並且照著做就好,每一個部分的分工都會比之前明確。

再者,用框架來改寫的好處就是你可以迅速跟之前的專案做比對,一定會有許多心得!所以這週在教完之後,會讓大家把之前的留言板從純 PHP 用 CodeIgniter 這套框架改寫,就可以比較一下兩者之間有哪裡不一樣。

(這一週預期會卡的很嚴重,如果你卡超過兩週,請果斷先放棄這週並且往下一週前進,其實這週跟之後三週比較沒有順序關係,要先跳到下一週也是可以的)

指定教材:

  1. 程式導師實驗計畫:Lesson 14-1 之 CodeIgniter 上
  2. CodeIgniter 使用手冊

HW21 作業連結

自我檢測

  • 我了解一般後端框架的各個元素
  • 我了解 Route 以及 MVC
  • 我能透體驗到純 PHP 跟有框架的差別在哪裡

前端框架(一)

終於要進入到前端框架 React 了(雖然嚴格來說 React 並不是一個框架,但搭配其他各種 React 生態系成員,其實就算是一個框架了)。

這週會學習到 React 的基本應用以及原理,了解為什麼我們需要使用 React。

延伸閱讀:React 性能優化大挑戰:一次理解 Immutable data 跟 shouldComponentUpdate

指定教材:

  1. [FE301] React 基礎:全部
  2. 程式導師實驗計畫第二期:Week12-1 React
  3. 程式導師實驗計畫第二期:Week12-2 React 續
  4. 官方教學
  5. React.js 小書

不確定有沒有幫助(因為內容跟第二期重疊的部分很多):

  1. 程式導師實驗計畫:Lesson 12-1 之 React
  2. 程式導師實驗計畫:Lesson 12-2 之 React 下

HW21 作業連結

自我檢測

  • 我知道 React 的目的以及原理
  • 我知道我們為什麼需要 React
  • 我知道使用 React 跟之前使用 jQuery 的區別
  • 我理解 state 跟 props 的不同

第二十二週(09/09 ~ 09/15):前後端框架(二)

後端框架(二)

之前上過了 PHP 與輕量框架 CodeIgniter,這一週會帶大家上 Express 並且來用 JavaScript 寫後端。

Express 是可以在 Node.js 環境下執行的輕量後端框架,自由度極高,也能夠快速開發出後端應用程式。

跟之前有完整 MVC 架構的 CodeIgniter 相比,Express 其實鬆散(或者說自由)很多,許多地方並沒有強制規範,都只是按照前人的方法或者是慣例來實踐,十個人可能會有十種不的寫法。

有了之前 PHP 以及 CodeIgniter 的基礎,我相信學習 Express 會快速許多,因此在這一週裡面可以試試看能不能快速上手 Express 並完成作業。

指定教材:

  1. [BE201] Express 與 Sequelize:「ORM 與 Sequelize」單元前所有內容

HW22 作業連結

自我檢測

  • 學習如何使用 Express 及其相關套件
  • 學過兩套不同語言的框架之後,我能發現其中的異同
  • 我理解為什麼會需要框架

前端框架(二)

在上一週結束之後,大家應該對 React 有了一些基本的感覺,這一週我們要繼續培養對 React 的感覺,讓大家對 React 越來越熟練。

除此之外也會教大家用 React Router 這一套 library,來實做前端的路由。

指定教材:

  1. [FE301] React 基礎:全部
  2. 程式導師實驗計畫第二期:Week13-1 還是 React
  3. 程式導師實驗計畫第二期:Week13-2 依舊 React

HW22 作業連結

延伸閱讀:前後端分離與 SPA跟著小明一起搞懂技術名詞:MVC、SPA 與 SSR

自我檢測

  • 我熟悉 React 的基本使用
  • 我知道如何使用 React Router
  • 我了解 React Router 的目的
  • 我知道什麼是 Single Page Application
  • 我理解現在的前端與以往的差別

第二十三週(09/16 ~ 09/22):前後端框架(三)

後端框架(三)

上一週我們學會了 Express 並且成功把留言板移植過來,對基本的操作都已經很熟悉了。

這一週要介紹的是一個新的東西:ORM(Object Relational Mapping),簡單來說就是把一個程式碼裡面的物件跟資料庫的物件做映射,優點就是當你操作程式裡的物件時,就會改到資料庫裡的資料。

而且你幾乎不需要寫任何 SQL Query,因為 ORM 都會幫你處理的好好的,你只要學習怎麼用就可以了。這一週會使用 Sequelize 這個套件來做 ORM 以及串接資料庫,讓你體驗看看不用寫 SQL Query 的爽快感。

指定教材:

  1. [BE201] Express 與 Sequelize:「部署:Nginx + PM2」前所有單元

HW23 作業連結

自我檢測

  • 了解什麼是 ORM
  • 了解 ORM 的優缺點
  • 了解什麼是 N+1 problem

前端框架(三)

在之前的 React 課程中,我們已經慢慢熟悉 React 的思考模式,可是還有一些問題還沒解決,雖然你現在感受不太到,但是在 App 慢慢變大之後就會碰到了。

接續之前的課程,這一週會讓你的 Web App 變得更加完整,會導入一個新的東西:Redux,說明我們為什麼需要它。

指定教材:

  1. 程式導師實驗計畫第二期:Week14-1 Redux
  2. 程式導師實驗計畫:Lesson 13-1 之 React + Redux

HW23 作業連結

自我檢測

  • 我理解 Redux 的目的以及原理
  • 我知道我們為什麼需要 Redux

第二十四週(09/23 ~ 09/29):前後端框架(四)

後端框架(四)

這週會使用 Nginx + PM2 來部署我們之前寫好的 Web Application。

除此之外也會簡單介紹 CI/CD。

指定教材:

  1. [BE201] Express 與 Sequelize:「部署:Nginx + PM2」前所有單元
  2. 程式導師實驗計畫:Lesson 14-2 之 CI/CD

HW24 作業連結

自我檢測

  • 我知道如何使用 Nginx
  • 我知道如何使用 PM2
  • 我知道如何部署 Node.js 應用程式

前端框架(四)

最後一週裡面我們將用 redux 來解決非同步操作的問題,讓大家知道如何利用它與 redux-promise 來解決非同步的一些問題。

指定教材:

  1. 第二期 Redux 補充講解:redux-thunk 與 redux-promise
  2. 程式導師實驗計畫:Lesson 13-2 之 React + Redux 下
  3. 第二期 React 補充:什麼是 super 以及生命週期的運用
  4. 第二期 React 補充:再來談談什麼是 this

HW24 作業連結

自我檢測

  • 我知道 Redux 如何搭配 middleware 解決非同步操作的問題

第二十五週(09/30 ~ 10/06):Final Project

第二十六週(10/07 ~ 10/13):Final Project

Final Project

正式的課程就到這邊告一段落了,你學了前端後端與程式相關的基礎知識,接下來需要做一些作品累積經驗,因此接下來幾週都會讓同學做出屬於自己的 Final Project,建議可以與其他人合作,但也可以選擇一個人單打獨鬥。

根據第一期的經驗,其實找人合作會是比較好的選擇(第二期因進度問題沒有 Final Project)。

如果大家一點靈感都沒有的話,可以參考以下幾個提案(但有自己的想法當然是最好的):

留言板

既然我們這次的課程做了這麼多個留言板,不如把留言板給做到極致吧!

你可以做一個「讓大家都能申請留言板」的系統,就像是無名小站那樣,每個人都可以申請帳號,有帳號之後可以開設自己的留言板,然後可以自己選擇要不要開放訪客來留言,不開放的話就預設是只有會員可以留言。

點下去會員的帳號之後還可以看到會員個人資料,或者是直接跳到會員自己的留言板去(如果有的話)。

除此之外,如果你想走前端的話,可以試著把前端改成 SPA 試試看!

論壇系統

建立一個論壇系統,能有不同的板塊(討論區),例如說:

  1. 閒聊
  2. 購物
  3. 程式相關主題

在不同板塊底下都可以發表文章,除了發表文章以外,下面也能夠有回覆。

或者是你也可以把板塊當成是 Tag 而已,在同一個頁面就可以看到所有的文章,如果你想找範例的話,可以參考:http://react-china.org/

購物網站

做個簡單的購物網站,可以參考任何一家市面上的電商,例如說這個我隨便找的電商:https://www.yuyufarm.com/

重點是除了前端以外,你必須要有後台能夠讓管理者登入,並且管理商品(例如說調整價錢、上傳圖片、調整順序等等),可以先完成一個最簡單的版本,之後再慢慢加強。

社交網站

可以直接參考 Twitter:https://twitter.com/?lang=zh-tw

你可以 follow 人,然後就能夠看到他的動態,也可以自己 po 動態,會出現在自己的 follower 的牆上。

總之呢,關於 Final Project,沒有靈感的話可以先從自己常用的東西開始下手,先打造出一個最簡單的版本再慢慢加強。也可以盡量去找一些第三方的 API 來串,增加自己串 API 的經驗,例如說:

  1. Firebase
  2. Google Map API
  3. Google Login, Facebook Login
  4. 金流

繳交 Final Project

請準備好以下幾個東西並且於第二十七週 po 到 Slack 裡面:

  1. 作品網址(沒主機或是 deploy 碰到問題的可以來找我)
  2. 5 分鐘以內介紹作品的短片,上傳到 YouTube(可以不用露臉,你不想出聲的話後製加文字也可以)
  3. GitHub 網址(請確保你有把一些敏感的資訊例如說資料庫密碼之類的拿掉)
  4. 做 final project 的心得(看你想寫在哪裡都可以)

自我練習

Codewar 是一個程式解題平台,靠這些題目,可以訓練自己對語法的熟悉度以及維持手感,更進階的題目則是能夠訓練思考邏輯以及解題方法。

我依照難度整理出了一些題目,平常做作業卡關或是沒事做的時候,都可以解一下這些題目。

Codewar 題目列表

Tech Stack

這邊列舉這堂課程用到的所有工具。

  1. 課程直播:YouTube
  2. 群組聊天:Slack
  3. 交作業:GitHub + GitHub Classroom
  4. 練習題目:Codewar

mentor-program-3rd's People

Contributors

aszx87410 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

mentor-program-3rd's Issues

學生心得:keronscribe

我大學念戲劇,今年剛畢業。
我在這門課上的劣勢是比同學晚一個月開始,優勢是可以閱讀中英日三種語言的資料、可以沒有假日一天坐超過八小時,還有住在台北可以去小樹屋。

挺有優勢的。

關於人

「一個人走得快,一群人走得遠。」
可以走完這堂課,我覺得最大的因素,是遇到了幾個一起走的人。和很多線上的自學課程不同,Lidemy 這個課程,除了課綱和內容,也把時間加進整個計畫的一部分,有彈性的時間表——像是自己的跟課進度,也有硬性的時間——像是課程的開始和結束。
我以前經常覺得按表操課是一件很蠢的事情,誰確切知道一件事到底要花多久,又怎麼可能把這樣一個制式的單位塞到流動的生活裡。但是我們可以和別人共享的,好像也就只有時間,而因為有這麼明確的時間軸,我們才會這樣或快或慢的一起走過半年。

2012年,紐約時報的專欄文章「The Age of Big Data」被視為大數據時代來臨的一個重要宣告的時間點,同一年,edX和 Coursera被創立,線上學習,尤其是資訊科技相關的學習內容在網路上大量出現,可以說只要走上網路,我們就可以找到所有我們想學的東西。在參加 lidemy 之前,我也曾在網路上自己看影片上了一些電腦科學相關的課,像是 CS50,還有一些 HTML 的理論,但有時候,如果我作業卡關,或者無法理解課上的概念時,我都會非常挫敗,感覺是連高中時期數學不好的挫敗感一起強烈地跑出來。現在想想,這種想要一個人征服一門學科的念頭,恐怕有點傲慢,也有一些自不量力。

哈佛大學的 2017 年入學演講中提到:「在 2017 年,我們有可能通過線上教育,積累足夠的知識,通過足夠的考試,以獲得大學學位。但為什麼我們要求你們所有人離開自己以往的生活圈,⋯⋯,我們為什麼要這麼做?我們這樣做是因為我們相信校園的力量,那是一種必不可少的教育力量。」
在這個課程裡,當知識的深度和廣度逐漸脫離可以輕易掌握的範圍時,幫我繼續下去的,除了老師,很重要,甚至可以說最重要的其實是旁邊一同學習的人。

Huli 這一期課程中加開了進度報告系統,是一個大家會把自己每天做了什麼事情寫上去的地方。另外實體上他也承租了一個共同空間,讓想去的同學可以去那裡交流。雖然這個共同空間說實話利用率並不高,常常只有幾個同學會來,但它確實是我可以走完這條路很大的一個因素。一方面是我知道有人和我一起走,第二方面則是我看得到別人的進步,也是這樣花時間練出來的。他們是當我累了的時候,決定再多 coding 兩三個小時的原因,而很多時候就是這兩三個小時,我把問題解了出來,或是整理出了思路。這是關於人,和我們一起經過的時間的事。

參與這個計劃對我的影響

「我不是學不會,我只是還沒學會。」這是我幾乎每週都會對自己說上幾次的一句話。
Lidemy 的這個導師計畫說起來包山包海,從前端講到後端,課程第一週就學交作業用的 GitHub 和 Commend Line,接著開始學用 JavaScript 寫 codewar 會有的題目,到了上課一個多月後才開始用 JavaScript 寫網頁互動。而在我們終於被原生碼折騰到的一定程度的課程後期,才開始被允許用方便的這種框架。就連資訊安全也包含在課程範圍裡。沒有一個禮拜的課程內容是我原本知道的知識,每一週的學習,都是不斷的在拉著自己走出舒適圈學習運用新技術的過程。所以過程中我學到的,不只是新技術,還有如何規劃學習策略,評估自身學習成效,評估學習資源和時間分配。
計畫的前期我還在參與舞台演出,整整比同學晚了一個月開始全力投入學習。可以在時間內完成,我覺得仰賴的是有放棄過於耗費時間的任務和功能的覺悟。因為有取捨,才可以不被龐大的學習內容和趕不上同學進度的壓力擊退,並且漸漸和自己的學習模式相處,對自己的學習負責。

也因此在這半年中,除了程式能力之外,最有顯著成長的部分其實應該是我的時間管理、專案規劃與實踐能力。

因為每一週的戰場都很明確,而且都有各自不同的目標和需要工作的點,我等於是有了連續 22 個有相互關聯性,但是又各自獨立的專案。
我總是會在作業完成之後的隔天早上重新檢視作業內容之後才會上交,而這一天通常也是我最放鬆的一天,會用來整理下一週要學什麼,規劃學習順序等等。我同時會在這個階段大致決定自己要怎麼面對這個禮拜的內容,通常會依據我認為這個東西在整個課程中再次出現的機率和重要性,也就是這週內容的影響力,來決定到底要下多少功夫在這上面。像是 CSS 這種在課程中會一直和它糾纏不清的主題,我會寧可在這週多待一兩天,讓自己之後可以自如地運用這個工具;反之如果是像是 gulp 這種要看公司專案有沒有用到才會知道學它的效益高不高的東西,我就會傾向抓個大概的概念,可以用一句話可以說完定義,然後可以再用幾句話大致說一下原理,然後就會止步了。「Plans Are Worthless, But Planning Is Everything.」這句話很適合用來對我在這一個部分的成長下註解。我現在簡直成為計劃狂,而我挺開心這個變化的。

關於 Huli 和師生關係

我算是比較不社會化的人,在某人還沒說服我之前,我不會因為他的身份是我的前輩就特別有禮貌,或者是見面就喊學長學姊之類的,所以打從一開始,我就沒有視 Huli 為老師,聽到同學說「老師有說⋯⋯」我還會覺得特別彆扭。
怎麼說呢,大概是我覺得師生不是一種身份,而是一種關係。在我還沒從你身上學到東西時,你只是一個個體。在我從你身上學到一些東西時,你是一個有經驗的個體,是一個前輩。當我從你身上學到的,已經多到你很難被取代,你有了特別的意義,這時你才是我的老師。
所以如果 Huli 有注意到,我大概到十多週之後才比較有在稱呼 Huli 為老師,在那之前都是「Huli」或者「大大」或者 「Huli大大」。這是一個很自然被影響的過程,但同時也是另一個我覺得在這堂課上很重要的部分。

以我的狀況來說,在課程的前期到中期,我都以一個很對等的姿態面對這個把知識分享給我的人,因此其實我一直都保有自己在學習上的主動性。這和前面提到的「對自己的學習負責」有很大的關聯性,我沒有期待這個老師「給我」什麼,他是課程的編排者,但我才是有最後決定權的那個人。但這同時和 Huli 給了很大的空間有很大的關係,他從一開始就清楚說明很多東西課上不會有,很多東西不會被手把手的指引,所以你得要自己查、自己找方法。但是同時,他又提供了「如果你已經努力了,你可以去找他」這個方案,至少我們不會絕望。

不過課程開始不久時我有問過他一次大家問問題的狀況,聽說大家都不太去找他問問題,我覺得有兩個原因,一是在一定程度之前,會因為面對的是一片未知,而很難「提出正確的問題」。第二是因為知道老師期望我們自己做過努力,但像我自己就會因為找不到著力方向,而無從評價自己到底「夠不夠努力了」,進而懷疑自己提問的資格。這種身為學習者的自我懷疑,也不是一時半刻就可以解決的就是。


以上就是我的學習心得,話說剛開始學的時候有想著自己心得要打得更細,像是檢討課程內容之類,但既然暫時看起來不會有第四期,所以就算了。
如果對於我中間做了什麼有興趣,請移駕我的部落格,而如果大家閱讀時有種不明所以的感覺,可以用 Tain 大大和我分享的一個觀點來解釋這件事

語言其實是一種很像 hash 的產物,他把無限的輸入,變成了有限的輸出,而且是一種不可逆的過程。

如果讀完這篇你還有任何覺得未盡的內容,我們就怪罪給語言,然後自己走走看這個無限吧。

我是阿千,我們有緣見~

學生心得:shuanshuan030913

開課之前那些五四三

同學,你有聽過前端嗎?

平面設計出身,在學期間一邊於業界打工一邊讀書,畢業前就已經確定自己不喜歡本科系的工作,之後花了很長一段時間靠面試找興趣,直到有個面試官問我:「你有聽過安麗...... 啊不、前端嗎?」才第一次接觸到這個神秘的領域⊙_⊙

前端的大門在前面,但是我打不開嚶嚶嚶

在工作中,過了一開始的幸福學習後,因為一直沒辦法深入的理解更具技術力的部分,出門在外都不好意思稱自己是前端,充其量給自己定位成網頁設計,背地裡暗搓搓的打開瀏覽器搜尋:前端、如何學習。

網路上的教學五花八門,看了文章還學不起來的我,知道也許該是時候找個老師了,只是那麼多的老師,我怎麼知道要追哪一個?哪一個適合我?課程買下去到底是我的蜜糖還是我的雷?(╯‵□′)╯︵┴─┴

上帝不給你開門,那你知道爬窗嗎?

後來因緣際會下搜到 Huli 的文章,具體看過哪一篇早就忘記了,但覺得這個人的文章怎麼能這麼厲害,文章有聲音,就像會說話,順著作者連結連來連去,直到我看見:程式導師實驗計畫

那時候是九月中,第二期剛結束期中的心得分享,當下其實心裡超扼腕,想說啊啊啊七月開課我怎麼九月才看到,如果我看到了我肯定不會去找工作的啊啊啊我一定專心學習向上當個好學生(當時六月正好在找工作,七月就職)

迷妹模式 On

從此把自己的 mail 提供給官方、在 lidemy 粉絲團按讚搶先看,一直刷新消息就為了想知道有沒有下一期可以報,刷啊刷的終於給我刷到:第三期實驗導師計畫招生,飛速的組織好報名信做完指定任務就送信了,收到回信的當下感覺人生整個不一樣,未來亮燦燦的像是會發光(/≧▽≦)/

老師喊你上課囉

課程為期六個月,從四月中開始到十月中結束,找工作預設為兩個月內,到十二月中正式結束,課程中間設立複習週

Week 1 - week 5

萬事起頭難,剛開始調整工作和學習節奏的時候是混亂的,但一切又都充滿了新鮮感,學會了什麼都很興奮,我覺得非本科系的優勢就在這裡,因為什麼都不會,每次學會一點就覺得自己很厲害,整個成就感 UP,雖然是有工作經驗,但我只會工作裡有用到的東西:HTML、CSS、Javascript

CLI?不會!
Git?不會!
API?怎麼和工作用的不太一樣?
markdown?哦哦哦這個好方便喔!

那時經常下班後繼續寫 code 寫到 11、12 點,點燃整個學習路上的熱情,為之後的堅持打下基礎

也遇到了課程以來第一個難關:Http Games,完全沒有提示下,第一題都不知道在說什麼東西,對於網址的理解、傳值和操作是完全沒有概念的,這個部分也許是老師沒有料想到的吧(?)

Week 6 - Week 10

從基礎的前端到基礎後端,整個流程學起來還算順利,有工作經驗基礎,前端部分很輕鬆,後端老師也切割得很細,有點手把手的帶你寫留言板,這部分吸收得還不錯

Week 11 - Week 15

在上這門課之前,我對資安的概念就是沒概念,直到看到老師直播示範自己的留言板被駭,整個人都受到了衝擊 QAQ

回到前端的部分,要自己實作 API 也是沒有概念,直接搖頭去找同學的 code 來參考,前後端整合的部分的確是弱項,之後也深有體會

部屬是我很喜歡的課程,真的把網站架起來的那一刻充滿成就感,感覺自己前進到一個新的里程碑

並以這週作為分界線,之後就開始學習如何讓程式碼變得更好

Week 16 - Week 20

這個階段學習了一些讓程式碼更方便好用的小工具,像是針對 CSS 的預處理器、Gulp 和 Webpack,以及更艱深的 Javascript 知識,這些點都是當時自己學習期間反覆查詢都還一知半解的部分,現在就像打通任督二脈一樣整個串聯起來了
20 週的 google 課程也相當精實美好,是看完一遍還會想回味第二遍的學習影片

Week 21 - Week 24

在框架學習的分界線上我依然選擇前端,中間關於二維棋盤的邏輯思考是個難點,畢竟從來沒有平面化思考過程式碼該怎麼跑,之後在小樹屋聽 Huli 講解的時候他也有提到,很多題目並不是看到就會的,也是經過學習,讓我安心了一些
除此之外由於課程安排上 React 的部分是小單元影片集合起來的教學,Redux 則是看前幾期的直播影片,在吸收上無痛學會 React,但 Redux 卻來回看了幾百遍才懵懵懂懂的把作業完成,側面反映出我還是需要短影片作分段教學,能更好理解一項技術,同時也很慶幸我有跟上第三期,前幾期的同學要看著一大段影片學習,最後並成功找到工作非常強!

Week 25 之後

花了約一個月時間打造 Final Project,並嘗試使用老師沒有教過的技術,挑戰自我學習,結果門檻還是蠻高的(╥﹏╥),花了很多時間研究文件和實作,大大拉長 Final Project 的製作時間

找工作期間,其實也有提到若是當初選用熟悉的語言來練習應該會更快完成,不過每一種嘗試都是珍貴的經驗,不試試看又怎麼會知道呢?我還是蠻滿意自己有那顆願意嘗試的心意的:)

面試的裡裡扣扣

面試就像整個學習計畫的最終驗收,到底能不能成為一個合格的工程師菜鳥就要看這個結果了。

在投遞履歷的部分,整個課程亮點完全展現出來,向海一波湧來的面試邀約讓自信爆棚,至面試結束,我主動投遞的職缺有 41 間,得到 16 間的面試機會,並還有一些主動打電話來的面試邀約,一下子就掌握面試選擇權

面試的結果還是要看雙方的緣分,像強者同學的海量 offer 是沒有的,自己本身也不是技術力頂尖的人,所以對 offer 的得失心是一部份,更艱難的還是自我質疑,在一個漂亮美好的課程規劃底下,我擁有機會,但其中到底理解吸收多少?能夠成為自己的能力並展示出去的又有多少?

經過整整一個月的面試,中間也有數次暫時的喘息調整節奏,壓力點來自也許過高的自我要求和家人明明很焦急但是不說的那些眼光

很感謝那時和 Huli 的一頓飯,減輕了對自己的不信任感並得到很多方向上的指點,覺得前途又閃爍著一些光芒可以嘗試,也在還沒來得及嘗試之前就收到滿意的 offer,結束這不知終點在何方的火車之旅

回想計畫,真的如當初想像中般美好嗎?

為什麼當初選擇你

  • 課綱紮實完善
    在工作上、在自學中多少都知道應該要學會哪些東西,只是吸收不良或不知道從哪裡開始學好,課綱列的相當詳細,感覺從頭到尾跟完的話絕對是符合我的需求,於是就是他了

  • 社群 & 同學的力量
    雖然我沒有上過其他的線上課程無從比較,不過我非常喜歡有人和你站在同一個起跑點一起前進的感覺,可以發文哀哀叫這個很難那個不懂,同時又很努力的想要把它學會,看同學寫出來的 code 和你不同的邏輯也很有趣,同時又不會像網路上那些大神 code 把炫砲的語法甩來甩去都看不懂到底是從哪裡冒出來的,還可以偷偷去抱強者同學大腿偷窺同一份作業到底能多麼天差地別

  • 收費方式
    報名簡章內容是這樣寫的:

    開課後兩個月內不用付任何錢,當開課滿兩個月後決定要繼續上課的話,請付 5000 元新台幣保證金,之後若被淘汰掉錢也不會退給你。

    在結業後兩個月內找到工作的話,學費總額是一個半月的薪水;沒找到工作的話費用全免,我連 5000 塊一起退給你。

這點讓我能夠比較放心去踩雷,畢竟錢花出去才發現課程內容讓你全程想睡或根本沒聽懂完全學不了的話,心會痛死

點頭之後才是磨合的開始

課程優點

  • 技術演化史
    在學習單一技術的時候可能只學到怎麼用,不知道為什麼要學這個,這門課因為是整合前後端的課程,勢必要將所有的基礎都讓你知道,從Javascript 到 JQuery 到 React,變成一個有條理有脈絡的學習,基本語法用習慣之後,再學別人包裝好的套件變成一件理所當然的事情,因為我們都知道自己正在用的東西是做什麼用的

  • 不定期直播
    直播你問 Huli 答這部分很有趣,同學們的問題五花八門,從技術問題到課程到 Huli 對計畫、對學生、對自己的看法都有,看直播會讓你看到作為一個計劃創辦者的角度如何面對學生問題,解決問題的過程

  • 每週隨意聊
    不只隨意聊,在社群上常常也可以看到 Huli Po 一些閒話家常的東西,常常也會冒出一些很奇妙的論點,像是:

    阿本來就沒有自信,求職失敗之後哪會「失去自信心」?
    你已經沒有什麼好失去的了
    (面對同學不敢求職的心態)

    還有

    如果真的很想放棄的話,放棄也是可以的唷
    (堅持和放棄都是個人的選擇,沒有誰是必須堅持和必須放棄的)

    除了心靈雞湯以外還有負雞湯

    Oh, Hoffnung genug, unendlich viel Hoffnung - nur nicht für uns.
    噢,這世上是有希望,無窮的希望。只是你我沒有。
    —Franz Kafka, eine Biograpbie

    我看完這些就很想要繼續努力下去了呢(奇怪來上課結果一直被看扁 XD

  • 課程機動性調整
    這門課程雖然說都是讓我們自己看影片學習,但其實大部分的同學進度到哪裡,Huli 就在哪裡,如果大部分同學都卡在同一個地方,Huli 就會挺身而出,資安週直接開直播幫我們上了一課、課程內容讓同學不小心走歪馬上調整文字說明、有問必答的私訊和 pr 解惑,這些都是對學習很有幫助的部分

  • 不是只有 Huli 在教你
    大部分的課程影片都是 Huli 上課沒有錯,但是中間有時候會有其他也非常好的教學資源也會出現在課程裡,網路資源的豐富這個點我覺得是很棒的,讓初心者知道世界之大,資源之多,如果可以在課程文字說明中分享一些值得關注的論壇、人、社群,甚至是下文會提到的關鍵字,都會是很有幫助的部分

  • 面試心得分享
    在大家走向求職之後,社群裡有越來越多的面試心得文,不管是面試題、公司介紹還是主觀心得,都是很棒的參考資料,比起線上五花八門的求職心得,同學的心得們將整個求職市場做了一個宏觀的串聯,讓初入這個業界的同學認識不同的公司類型以及需求的對像,交換資訊,知己知彼百戰百勝ヽ(✿゚▽゚)ノ

可以改進的地方

  • 課程影片
    因為自己學習起來,單元影片的吸收是比較良好的,所以有些比較明顯的弱項,剛好都出現在非單元影片的部分,在脈絡整理上需要更多的時間去思考,單元影片的記憶也比較深刻,之後回去找忘記的地方也是只有翻單元影片來看,而不是直播影片

  • 學習關鍵字
    在課程簡介裡就有提到希望能夠培養自己解決問題的能力,有時候會導致其實自己已經卡關了,但是我不說我就要自己想辦法的狀況。如果能夠有適當的小提示,或是如果有進度超前的同學學的不夠,可以有延伸學習的關鍵字,也許課程會變得相當豐富,適用於更多不同程度的同學呢?

天下無完人之自我檢討

  • 時間的調配
    課程剛開始的時候是邊上班邊學,課跟了下來,也學習了很多,後半部分全心在課程上,好像沒有感受到時間變得非常多,在 final project 反而進度有點拖沓,當然中間有很多因素不能只單看有沒有上班,還有課程前後期難度不一,但還是非常懷念能夠當年(?)邊上班邊進修的效率時光

  • 穩紮穩打 or 追著進度跑
    想要跟上課程的節奏,在很多部分其實著墨不多,不會很深刻的去細究學習中相關知識,只把課上的內容學會就去下一階段了,但同時也是堅持下去的動力,畢竟掉隊會懈怠的風險還是很高的,希望每一階段的學習都是有時效性的,不能無限上綱

  • 複習週
    除了第一次的複習週真的很認真地複習之外,後面其實都假裝自己在複習其實在廢 lol,學的東西很多,也不是當下就忘記了,就會懶得回去看一遍(但是現在倒是有些東西真的蠻需要複習的,這時候回去複習也許意義非凡)

  • 自學的能力?
    課上教的東西在 Huli 的帶領之下的確可以穩步成長,但究竟脫離課程之後,自己到底有沒有辦法在一定時間內掌握一門技術?這個真的要打上大大的問號,在 final project 上的實驗也不是很理想,並很快就可以見真章了,未來的新工作又是一門新的技術考驗.....

計畫的尾巴,人生的轉折,職涯的開始

6+2 長達八個月的計畫終將告一段落,這是計畫的結束,也是工程師生活的開始,得到了職場的入場券後,接下來就是試用期的磨練,一如我那瞻前顧後的性格,恐怕要等到試用期過後才能放心並充滿自信地讓別人知道我是一個工程師吧!

在進入這門課之前其實已經將課程資訊分享給相關朋友知道,只是最後選擇報名的只有我。如果將來有下期,我還是會選擇把訊息分享給想進修或想轉職的朋友知道,課程的優劣我已經親身體會過了,剩下的就是等一個有緣人吃我一記安麗吧:)

感謝這個課程,感謝 Huli,感謝每天發進度報告無形中一直在 push 我的同學們(〃∀〃)

學生心得:minw

同步修訂版刊載於 Medium 上 -
記在程式導師計劃之後(上):風雨飄搖的執著
記在程式導師計畫之後(下):求職天堂路

背景

從學生生涯末期的兩到三年都在苦思什麼是設計?在快速成長的領域之中試圖想要定義自己的設計觀,最後得到「開發是設計的匠性。」的答案,於是期許自己要能從研究定義出更好、並從設計到開發對這個更好負責。

過去摸過很多工具,像是: R, Unity, Arduino, processing, Grass Hopper 等能用但稱不上會用。所以有 loop, function, condition, variable 程式基礎概念,略懂 jQuery, HTML, CSS,但這一切比較像是工具人不是開發者,不能做出產品。

所以為了自己的哲學、補上這塊拼圖跟一了長年風雨飄搖的心願許多理由,報名了這次計畫。

對了,嗨,我是 Lidemy 程式導師計畫第三期的學生,是 MBTI 中的 INTP,喜歡後設所有事情,喜歡一路從說要做、為什麼做、要做什麼、然後做出來,是個有點獨有點怕生不會開話題,不過喜歡看動漫畫玩遊戲、做動畫跟閱讀寫作,希望自己可以做到求真求善的人。

在這次的課程裡面有一半時間在碩二下跟一半完整自學的時間,這是我學生生涯最後一次機會。

課程

課程本身的技術內容就留給 Syllabus,因為真的就是那樣,真心不騙的扎實。

課程前期

一開始學了框架前應具備「脈絡」包含:程式基礎觀念、常見的前端技術、AJAX、資安跟後端基礎。

由於出發點就是想搞發明,從一開始就從 shell script 就很想要開發 side project,當時有用 Timely 追蹤自己的軟體使用時間,就用 shell script 開發了一個可以紀錄的工具,可以新增、統計,然後透過 +++++ 來視覺化。後續學到 API 之後,改用 google api 來做一個統計的網頁頁面,到了十五週又有一次進化,做成一個利用 Bootstrap 跟 jQuery 搭配 D3.js 做出更複雜的工時資料視覺化的小 project。

從 side project 就可以看出來這是一堂工具演變的過程,在這個過程中我們學習到不只是工具怎麼使用,還包含:技術為什麼存在、後續的技術改善了什麼問題。

到了 PHP 學到了 OOP,除了應用 OOP 在 PHP 的留言板裡面,也回去重構串接 API 跟小遊戲的作業,也重構了自己碩論的網頁。在課程之中也有超級挑戰題,可能是一些更複雜的技術、或者資工的演算法題目,在這之中嘗試了 D3.js 等課程之上的內容。重構的、額外的作業老師也願意重新做 Code Review,所以不止學技術、也學怎麼學新技術、跟什麼是好的程式碼。

同時課程中也不乏機會,跟老師合作開發 R3:0Challenge 的專案是最有成就感的高峰,開發出的東西被使用、看大家的心得,給了我很大的動力。加上過程中我們有很多回顧自己程式碼復盤的機會,包含:複習週、學習系統等等,心得大幅提升自己省視自己的能力,也可以讓自己從別人的心得學習別人的思路。

總言之,前半段的課程一整個就是學習興奮期。

課程後期

在後半段的課程將會慢慢銜接進框架之中,開始了解 javascript 底層的原理而且接觸各種工具來解決網站工程上的問題。

後續在進入環境架設的環境一度低谷,摸了 Docker、CI/CD、系統環境跟 javascript 原理拖沓很久、甚至鑽牛角尖,在到框架換腦的過程也卡了一陣子,那是我最灰心的時候,覺得自己怎麼搞的。但時間如果拖得太久,老師會適時的透過 Slack 關心,給一些學習建議。

更重要的是老師很了解拖延症這件事情,極力宣導面對拖延症的應對進退,讓你可以平靜地看待自己,調整自己的步調,而不會陷入罪惡感圈圈。與同學的互動也是良性的,在社群設計上有點距離感但又能交流的學習系統讓我們不會一直去比較彼此,因為你了解對方怎麼做到、知道對方也不容易、這時候是不是很忙又或者只是剛好在休息。

營造一個專注在自己成長但又能砥礪的環境,讓人可以延續學習下去將課程更困難的內容完成。

專案時期

在灰暗的低谷中,回到初衷開發專案是推進我的另一個動力,Final Project 跟把課程作業升級成 Project,這兩個專案花了很多時間來思考,怎麼樣才是自己想用、別人也能用的產品,是兩個第一次從研究到開發自己實現的專案。

在個人特效網站裡,部落格網站被設計成特效網站,過程中其實迭代了許多想法,特效改來改去,然後把以前接觸過 Canvas 跟 SVG 應用在部落格裡面,再學習 ReactTransitionGroup 的使用方式,試著做出有 CRUD 的視覺特效個人網站。

課程從後端到前端都有真是太好了,很慶幸自己也有把後端的部分完成,否則不會有那麼高的成就感。

到 Final Project 真的是完完全全的從以前的研究經驗出發,做了自己從很早就想做的影音筆記服務,參考著 Product Hunt 上的水平來進行設計跟開發,串連 Youtube API 一樣前後端開發完成了一個有點產品感覺的服務。完成的那瞬間我沒有遺憾 XD 我的目標達到了!我自力做出了一個完整的產品了!我踏上我目標的起跑點了!

在兩個專案中熱情高漲,畢竟這就是我的初衷,但也深刻的感受到,再多的熱情都有枯竭的時候,當你希望一個東西好起來真的是永無止盡,視覺、體驗、程式碼每一個環節相扣又都可以更好 ......

如果放棄的話,作品就完成了。

求職時期

最後的最後老師跟家人推了一把,即將要內推跟課程結束、在家休息一季之際,速速的準備了履歷跟老師討論,甚至做了簡報、錄了自我介紹的影片詢問老師意見。這些繁瑣的事情都沒有被拒絕 XD 雖然沒有照著建議走海投跟迭代路線,是東西都準備好了、按照著志願序投遞履歷。

複習著課程 Syllabus 裡提到的重要觀念、看老師以前寫的面試文章等等,這些讓面試順利很多很多,這個過程可能面試有的問題也都可以詢問老師,從最小最小的可不可以做簡報到面試題不知道答案,一路中老師都沒有缺席。

最後如願以償的得到自己喜歡的公司的 Offer。

求職後時期

寫心得的這當下,是上班前的幾天,這幾天一邊學習未來工作所需的技術跟重構以前的專案,整頓一下下一階段的目標,跟同學們交流,時間來得及的話想要幫專案弄支影片。

課程頭尾兩次的實體聚會、學長姊也會出現、中間也嘗試舉辦了一次讀書會這些交流聽關注的問題跟學習方法,像是:網頁板履歷就是從同學那邊學到的、還有一些 Anki 的用法等等,很期待未來應用這些方法。 覺得一些彈性實體交流的場合對無論內向外向的人都能適應、是很棒的機制。

小結

如果要我說這是一堂什麼課,這是一堂讓你能做到:

發而不中,不怨勝己者,反求諸己而已矣。

...... 這樣態度的一堂課,要能克己、真切、獨立面對困難的學習甚至面對人生都不容易。所以課程設計、社群互動、老師跟自己的互動促成了這種良性的學習態度。

這也讓我意識到,帶走的不是只有學寫、學怎麼學寫還包含學怎麼學。讓我喜歡上這種主動喜歡上一個領域的感覺,這比轉職本身還要難能可貴。

回顧

在這次計畫中,學習的策略有三:

第一,專案導向,希望所有的技術是以需求出發,如果沒有需求就從自己需求出發,記錄時間的 side project、用 gulp 建置 pug + SASS + ES6 的切版環境、Final Project 的影音筆記等等都是出於這樣的策略,因為這是我學習的手段也是我學習的目標。

第二,廣度優先,希望可以盡量多接觸不同技術,老師會一直丟出新的刺激,如果時間允許都為嘗試使用看看,Docker, Cypress, Travis CI, jwt, Mongo 等等這些技術都是老師拋出來的挑戰,趁著課程之中多多嘗試。

第三,時程兼顧,希望可以超前但不要 deplay 於課程原本規劃進度,在最後幾週同時接觸前後端框架讓進度 delay 了不少,但總的來說時間是對心理狀態的一個限制器,一旦超過越來越多就會慢慢放棄,只有一直緊緊跟著保持壓力才能走到最後。

學習技巧

課程中實作需要新技術時,我會先找該工具的入門教學跟回答五問題,根據入門教學接著開始使用後,搭配老師的課程架構遇到問題會開始查,例如:接觸 Vue 的時候就會查 Vue + State 、props、Props parent component、componentDidMount 等等,同時一邊看 Document 關於這些結果的說明,然後慢慢的做出一個最小的 CRUD、非同步操作的小專案。再慢慢放大成自己要做的結果。專案擴大的過程中會看見程式一些細節的「模式」,像是:常設定的參數等等,就隨觀察跟用到來查。

剩下除了一直實作外,可以稱之為技巧的大概有兩個,一個是產出學習另一個是問題模板。

課程中很強調心得、我自己還會畫圖,心得一開始 markdown 後來嘗試 Hexo 發心得也有嘗試過 Notion 到最後覺得還是 Evernote + Evertool 最好,畫圖有時候用 draw.io, miro 有時候就是紙筆,但無論哪一個視覺化思考程式的過程很重要,因為這可以讓你釐清哪裡出了問題,像是有一週的作業要一句一句的寫下程式怎麼跑,還有後續在釐清一路從 React, Redux 到 Observable 整條 action 流動的關係,這樣的技巧對於演算法題、或未來重構的時候都很有幫助。

另外一方面則是老師在文章裡寫過的五個問題,這個技術出現以前是什麼樣子?那時候碰到什麼樣的問題?這個技術的出現如何解決問題?所以這項技術應該如何使用?跟以前的解法比起來,差別在哪裡?有什麼優缺點?我想在實際有開發經驗之前,我們不可能對技術了解的盡善盡美,但至少在工具的選用上我們要知道這五個問題的答案,幫助我們定位工具的脈絡。

最後就是有些用不到的但對於程式整體會有幫助的事情要刻意練習,例如:重構、寫測試,在專案還小的時候的確不是當務之急,但這些努力可以提升你對程式碼的敏銳度,像是:在重構之中就可以改進自己程式的邏輯讓程式碼更漂亮、測試也提供你另外一個角度看你怎麼切你的功能,改變對程式架構的看法。

管理方法

在課程的資源管理上,分成知識管理、專案管理跟品質控制:

知識管理就是管理學習資料的方法,我自己喜歡用 Evernote 搭配 Evertool 做 markdown 筆記,因為這個工具很簡潔,筆記分類成 TODO / NOTE 兩個筆記本、Tag 都是 MTR 這個專案,並根據五個問題來寫筆記。而專案開發的靈感就會截圖存在 Eagle 裡面,當作未來想寫的功能的素材。未來 Evernote 的部分想要參考同學的做法做成 Anki 卡。

專案管理則是在後續專案範圍比較大來做開發時間跟功能切分的安排,有嘗試過 Notion 覺得功能繁複不夠簡潔,所以回到 Google + Google Task 把任務分類成 FIXME / TODO 來進行開發,並加一個縮寫辨識專案。FIXME 放寫完但出現的 Bug、TODO 放要做的新功能。

品質控制則是了解自己的狀態跟工作時數的方法來確保自己沒有怠惰,用了 Timely 記錄時間,然後統計在 Airtble 之中,用自己寫的小服務看時間運用的狀況。中間斷掉一陣子,最近在嘗試收回來,可能會換統計的地方,可能會研究開發看看怎麼抓 Google Calender 數據,想要統籌在 Google Calendar 裡面。

心態調整

過程中會累、會拖延。大多數時候,我會追求客觀事實來提醒自己,像是:透過時間紀錄來意識自己的狀態、裝 Mailtracker 看信件的狀況修正內容,但有時甚至連不要自欺欺人都做不到。

這時候尋找一些東西讓自己撐過去很重要。課程中,一個是老師每週的隨意聊,大概週末週一會有激勵人心的一些留言讓自己又打起了一些精神,以及自己也有存一些很喜歡的雞湯文、像是:重看全職高手小說自學四年日檢 N1 與多益 TOEIC 975 系列文延畢做自動飲料機的一年、想到以前做繪圖創業的學長跟以前很厲害的開工作室的同學,這些都是沮喪的時候就會打開來重看或靜心思考的故事。

這些 role model 讓我會再努力一下,除此之外 Eagle 裡面也存了一個 Happy Tag 把自己喜歡的東西,像是一些:插圖、柴犬等等的圖片,讓自己刷圖看著開心一點。在寫程式的時候基本上也不會聽程式的廣播,重聽了超多次的 LNG 精華 XD 再不行就好好喝一杯可樂。

什麼樣的東西讓自己開心又無傷大雅,這也是值得去探索的。

復盤檢討

每一個缺點都有好有壞,可能是某些優點的反面。

課程中過度樂觀許下很多願望,可能因為有那麼多願望才能比自己預期的做到更多,但也希望願望跟實際情況的落差可以縮短一點,更正確的評估自己的狀況。這部分可能希望透過更多前期預測跟結尾追蹤比較來改善自己看待自己的準確度吧。

同時也希望自己更細心與毅力,中間有一度低潮但我覺得這種過程是可以避免的,也許因為這段休息得到很強的專案能量,但也希望即便是休息也能維持最低限度的品質,也就是所謂的配速的哲學,怎麼在長期專案中分配自己的能量,讓自己可以保持追根究底的心情、維持課程作業的品質等等,目前還沒有具體的想法,但可能會想找一些有毅力的同學聊一聊。

最後一點,這是在交流會後的啟發,看到同學樂於分享、並把學習的過程跟專案累積起來公開並經營自己,讓我覺得大家都好厲害,在這一塊自己還是不夠、太彆扭,要怎麼讓自己選擇更有效率的分享過程,不僅僅只是私底下、非公開的分享,這一件事自己還需要更多的練習吧。

小結

我很喜歡老師的這句話:

...... 不是要跟你說你要一直努力,我只是想強調「一直練就會變強」這件事 努力是你的選擇,我不會要你一定要努力。但至少不能欺騙自己。你不能說著「我想跑全校第一」卻不練習跑步,要嘛就放棄想跑全校第一這個想法,要嘛就乖乖練習跑步,不能什麼都不做卻還妄想著不勞而獲的成果。

寫程式真的是一直練一直練就會變強的事情,就像家人身教言教傳達的程式是可以努力學會的事情一樣,有些技能看起來好像遙不可及,其實只是你騙過自己,要怎麼反求諸己,是一輩子的學問。

詰問:下一步將走去哪裡?

好不容易補上開發這個洞,在 Final Project 也體驗到一條龍從需求到開發的快感,我希望也可以像老師一樣有某個想要解決的問題、運用自己的技術來實現。在我來看老師是厲害的前端工程師也是成功的課程與服務設計師,這整套系統完整解決了不同階段跟表層到深層的程式教育問題。雖然老師總是很謙虛 XD

所以最後也都丟這類型的公司,有機會可以做到很多很多,可以參與產品跟開發,可以親手實現的新創或研發部門,希望自己可以保持著在這邊的心境走向人生的下一個階段,在職涯上希望可以持續:「真實、克己、獨立」的做出令人印象深刻的產品;自學上希望可以嘗試學習其他一直想學習的新領域,像是:畫畫跟語言。

總之,這個一切的一切想要感謝老師、家人跟同學,這麼大的人生轉變少一個都不會成真,對於未來的諸多可能,我只想說:

我比誰都期待我的作品。

學生心得:Clay Gao

一、前言與緣起

嗨,我是 Clay,這是我的 Lidemy 結業心得。

這篇文章的受眾可以很多,可能你是我的同學,又可能你想多了解 Lidemy 鋰學院或是導師 Huli,又或者,你是一位對程式或網頁開發有興趣的學習者,都可以參考這一篇文章。

簡單自我介紹一下,我是原本在一間小公司打雜的員工,舉凡部門會議,公司國內展覽,亦或者生產管理,協調業務與加工廠,都有我的份。

離職幾個月之後,有一日看到 Huli 於 Medium 的一篇文章,雖然沒有聽過這個人,但覺得他的文章寫得非常中肯,而且可以感覺到用字遣詞的的態度是誠懇的,因為喜歡這樣的撰文風格,不知不覺地把文章一篇接著一篇的看下去,赫然翻到了實驗導師計畫第二期的簡介文。

由於已經過了第二期的報名日期,且第二期也早已進行中,所以當時沒有想太多。之後,第二期也結業了,我也有接著看第二期的結業文,這也是我第一次完整了解這份計畫,但其實當時我並不知道還會有第三期。

直到某日,看到第三期報名簡章出來時,我相當興奮,立刻下定決心報名這份計畫,當然,這份計畫也不是說報名就能報名的,需要完成一些 Codewars 的題目,以及用 Sketch 完成一個小作品,經過 Huli 認可,才能被錄取。

在寄出報名信之後,我相當緊張,不知道自己能不能獲得資格,幾日之後,我獲得了錄取通知,感到相當開心,同時也與女友交代後事,呃不對,應該是交代說:請給我半年的時間,我假日可能無法陪妳了。

會這樣說是因為 Lidemy 的淘汰制,更由於當時的我才剛上新工作一個禮拜,雖然是一個幾乎不會忙碌的工作,但還是強迫自己做好心理準備,至少會有半年的長期抗戰。第二點,以當時對 Huli 的了解,讓我覺得他應該是位嚴師,才會訂定出淘汰制的制度。


二、承諾與目標

在報名信中,有承諾 Huli,我只會工作到五月,時間一到,就會離職學習,但我最後沒有做到,原因是因為自己一直都可以跟得上進度,再者是因為工作時的空檔可以讓我聽課並練習,至此,居然就讓我在一邊工作一邊學習的狀態下,一週接著一週地完成課程。

若背棄承諾,就用更大的承諾去修補它

既然沒辦法做到離職的承諾,那就一邊帶著工作一邊把學習學習好,這就是我所謂更大的承諾。

當然,我不是一個有程式天份的人,我也不是一個學習狂,所以儘管完成課程一週一週的完成,讓自己盡量保持在一線 (也就是跟得上當週課程的學生),仍無法讓所有的作業都獲得 Huli 的嘉許。

順帶一提,對於每週同學們寫得好的作業,Huli 會替其標上「值得參考」的標籤,我天資駑鈍,加上自己其實沒有每週都達到 40 小時的學習門檻,所以只要是專屬於 coding 的作業,「值得參考」的標籤,我幾乎都拿不到。

但相反地,只要是概念相關的作業,多少還是能拿到「值得參考」,在我的學習路上,每一次拿到這個小黃標,都是一份莫大的鼓舞,但對於沒有拿到黃標的那幾週,對我來說就像是債務一樣,一層疊著一層地壓在我的心頭,更不用提某幾週較為糟糕的作業。

或許有人會疑問,「值得參考」是額外的嘉獎,沒拿到又不代表作業不 OK。但其實我認為在第三期的實驗導師計畫中,對於作業的批改算是寬鬆的,所以久而久之,拿黃標就會是一個成為一個自我審視的標準,至少,我是這樣覺得的。

日復一日,早上八點半出門,晚上七點半到家的我,將時間壓榨得很剛好來學習。而假日幾乎足不出戶,因為要趕作業。這樣的學習過程,到第二十週為止,每週都在進度上。由於花的時間相對於其他同學來得少,自然而然,就少了一些作業的訂正與 coding style 的矯正,我想,這也是導致我 coding style 一直不漂亮的原因。

學程式這件事情,是很公平的,但也就是因為它的成效端看你投入多少,所以,它的確值得投資。

而在課程的最後我也明白,Huli 和 Lidemy 只是峭壁上供你抓握的繩子,要爬上去,還是得靠你的手和腳。

這門課程帶給我的意義,不僅僅是學程式而已。

是從強調這份課程重視自學,到最後讓我領悟到,其實所有的學習,不論有沒有課程,有沒有老師,都是自學


三、課程與日常

我記得在課程剛開始的時候,有師生見面交流,那時候第一次遇到 Huli,就跟他說其實自己還蠻怕被淘汰的,但 Huli 卻說:哈,其實被淘汰也沒關係啊!

即使被淘汰,也沒關係。

由於當時內心不服這句話,所以更下定決心每週都要達成目標。

其實對於每週的學習,覺得最可怕的事情就是發 PR 然後等老師批改作業回來的那段空檔,那是心裡的煎熬,不知道會得到什麼樣的評語,是拿到小黃標,還是得到不帶感情卻實在的建議。

但講到這邊,我覺得 Huli 其實是位很暖的老師,因為長時間使用網路的我們都知道,文字是冰冷的,所以 Huli 在批改作業時會不時加上狀聲詞與表情符號,讓學生們不想太多 ( 也可能是習慣 ),而只要學生在 PR 提出問題與討論,Huli 都會做回應,並就其所知給予資源與方向,這是我參考自己與其他同學交作業的 PR 而得到的結論。

每週的學習,都是挑戰,因為我能運用的時間不算多,所以我都只將目標放在每週的禮拜天,交出作業即可,我覺得學習就是這樣,跟著 Huli 給你的進度,一天接著一天,一週一週去完成,這是有課程與無課程最大的區別。

另外就是第三期改為全線上課程無直播,我也覺得相當不錯,因為課程直播時會害怕自己沒辦法跟上老師進度,所以會強迫自己專注,當神經緊繃的狀況下,學習力可能會降低。利用全線上課程,導師方不但可以優化教學品質,學生也更能掌控學習時間與狀況,可謂是一舉兩得。

而為了彌平全線上課程所缺乏的即時交流部分,在第三期課程中,Huli 也會定期開直播,先讓學生們於 Slido 提出問題,並於直播中一一回答。同學們提出的問題五花八門,有程式問題、職涯問題、學習問題,甚至是 Huli 的感情世界等等,問答內容可說是沒有受限,所以更能體現這半年來,除了學習程式以外,也伴隨著不少樂趣與笑點。

對了,除此之外,Lidemy 自備 Slack 群組,任何的即時問題,Huli 也幾乎是有求必應,只要時差算好即可。


四、學習與難關

上一節提到,自己因為不想被淘汰,所以努力學習。

我相信對於學習程式這檔事,每個人都有不同的理由,有些人是熱愛這門技術,有些人是因為不想輸,有些人則想利用技術完成目標,而也有些人全不為什麼,只是按部就班,做自己認為該做的事。

學習的理由五花八門,但與理由同樣重要的是學習的成果,我們的目的是找到工作,去印證這門課程帶給我們的成效。的確,在 Lidemy 課程所學到的技術與工具,對於現今職場需求,命中率的確非常之高,這是我在經歷過前三間公司面試之後能確定的結論。

幾次面試時,我居然也會訝異,自己是如何從一開始對程式一竅不通,到現在,我就坐在這個接待面試工程師的會議室,等待著面試官進來面試。

從一開始完全不懂程式概念,到後面知道程式的本質,知道 JavaScript 與網頁節點,到它們是如何交流的。

瞭解前後端,其實沒那麼複雜。他們是如何溝通,溝通之間可能會觸及哪些漏洞,而溝通又是依循什麼規範。

到最後去了解何謂框架,框架是什麼意思?他用了哪種邏輯方法去達成這個效果?前端的資料怎麼跑,路由怎麼決定?

一切的一切細數起來,儘管龐大,卻不遙遠,現在的我,對於上述皆觸手可及,差別僅在於掌握得深不深,經過半年八個月,我成長了,我快要成為一位工程師了,但沒想到在這個時期,我卻遭遇了一個最大的難關。

這個難關是什麼呢?就是其實我對於我所學習到的技術,並沒有真的掌握住。一開始有提到,學程式這件事情,是很公平的,投入多少,就得到多少,儘管最後,我完成了課程,我以為自己學完了,但直到出去面試,遇到一些基本的問題,我卻回答不出來,那種回答不出來的感覺,不是不會,而是一種我必須得面對,回答當下那種心虛的心情。

由於這種心虛的感覺,所以原本與 Huli 說好的,會持續面試這件事,我卻步了,我開始封閉自己,我開始靜下心,把原本「我完成課程了,可以面試了」的心裡話,換成「我真的學會了嗎?我真的可以不靠任何文件與範例的情況下打造前端嗎?」

換個角度看,我才知道,問題出在哪裡。


五、誠實與反省

記得課程甫結束時,我也從原本的工作離職了,時間大概是去年 11 月 15 號的時候,以為終於可以無縫接軌,沒想到有一道坎,深深箝制著我,難以跨越。

而學習完全部課程之後,我總是覺得自己不想做 Final Project,一開始,是以為自己沒有想法,但經過對自己誠實反省之後,我才理解,其實不是那麼一回事。

Huli 排的課程,不論是每一週,還是以四週為一單元的階段,都是有目的性的。對於 Final Project,當然可以選擇做,與不做,甚至對於 Week21 之後的 React,你甚至可以連學都不學,就出去面試,挑戰自己,但前提都是自己問心無愧,畢竟,這是一場屬於你自己的戰爭。

而我呢?我問心無愧嗎?

其實,我一直都知道自己對其所學的掌握度並不高,卻因為想快點求職,所以直接做了幾場面試,但對於自己的表現始終不夠滿意。

平平都是完成的進度,學習時間卻總是比別人來得少,然而學得快,忘得也快,我總以課程結束當作理由來求職,才知道,課程結束不結束,其實並不代表什麼。「你真的會嗎?你真的懂了嗎?」我這麼問自己,而答案可想而知。

於是我暫時暫停了面試,曾經有那麼幾天,我心灰意冷,足不出戶。當時一邊工作一邊努力學習的我已不復存在,我到底怎麼了?以為離職之後,就能好好複習,準備面試,直至當上工程師,但卻毫無動力。

然而,有一天,我突然頓悟了

原來,我拋開的不只是工作,連與工作並行的學習模式,也一併拋開了。

於是我打開過去的作業,看著過去我自以為在理解狀態下寫出的程式碼,從第二十四週,看到第二十二週,再從第十七週,看回第九週 ... 這是什麼?我為什麼會這樣寫?我反覆端詳,試著從一行又一行的程式碼之中,找回過往的記憶,但卻如此地難以掌握。

終於,我停下了動作,雖然說不上來,但似乎懂了。

直到現在,我才明白,是時候該補齊那些自以為已經會的東西,是時候,該踏踏實實的看自己會了什麼,能做什麼。終於明白,為什麼 Huli 當時會說「被淘汰也沒關係」,因為你無法永遠依賴課程,我們終究要回頭看看自己,誠實面對自己究竟掌握了什麼。

當自己意識到「值得參考」不再重要了,沒有 PR 可以發了,Lidemy 課程結束了的時候,也同時意識到了自己的人生課題還沒結束,還在繼續。

我打開了 VSCode,重新使用 Create React App 撰寫一個 SPA 網頁,「現在,該自己派作業給自己了。」

從一些小功能開始引入,接著建立 Redux,並使用 React-redux 連接,搞懂兩者的區別。開始從零開始自己模擬 Redux 的資料流,直到我 Dispatch 成功,再從 props 拿到取自於 Store 的資料,不依靠任何範例與文件。

什麼是 middleware?原來我根本沒有搞懂它的精髓,於是重複再看了教學兩遍,解決非同步問題,我真的懂非同步嗎?回去複習之後並掌握了非同步的意義之後,我才明白為什麼我需要使用 Redux-thunk。

接著,我也開始學習 styled-component,去體會使用 CSS in JS 帶給我的方便性與缺點,於此同時,我也把 React Lifecycle 全盤複習了一次,比如說之前常常搞錯的,究竟是先 render 還是先到 ComponentDidMount 等等,好多疑惑頓時解開了。

最後,開始去查詢 React hook 的官方文件,明白它的優點,與它能夠代替的並非是 Redux 本身,而是 React-redux - 也就是 React 與 Redux 的橋樑 (我之前一直搞錯的部分),不再需要使用 connect,而是利用 useSelector 與 useDispatch 來替代 mapStateToProps 與 mapDispatchToProps 來簡化寫法與節省開發時間等等 ...

慢慢地,我開始嘗試找回自己學習的方式,我不再無精打采了。我逐漸發現,那天面試時,回答得不好的那一題,我會了。長久以來不敢去面對的技術弱項,也不再困擾著我,反而一個接著一個地變成了自己的武器。

這半年多來,你學會這麼多技術和工具,從來不是最重要的。

真正能使你成為好的工程師的,是你這段時間以來,學習的這段過程


六、真正的學習

我個人認為,程師導師計畫第三期課程,是一份完全適合在職者的課程。也就是說,拋開工作類型的多樣性而言,一邊工作一邊學習,是絕對沒有問題的,雖然課程聲明有淘汰制,但實際上只要你展現學習的熱忱,課程不會真正把你淘汰。

雖然這樣的說法可能很奇怪,因為自己並沒有於期限內找到工作,但依照自己的經驗來講,從 Week1 到 Week20,自己都是一邊工作,一邊在進度之上。

而學習上遇到的困難,我認為更多是在於自己的心態調整,因為課程容許學員可以依照自己的規劃學習,所以不會有真正的 Deadline,而對於學習上的困難,Huli 也可以說是來者不拒,會幫忙給予建議與回答問題。

因為我個人是比較害羞的類型,所以 Huli 可能比較少收到我的問題,但其實我的內心是充滿著感謝的,畢竟,儘管我沒有在期限內找到工作,但我在最後求職時的意志卻比課程進行時更明確了。

並且,我突然回想到,Huli 最初的那句話 : 「被淘汰,也沒有關係呀 !」

那是因為真正的學習,是不論有沒有課程與導師,自己都能比昨天的自己更好。不一定要更上一層樓,即使是小小的一階梯,也綽綽有餘。

另外,在課程結束後,Lidemy 的同學們也自己月租小樹屋來作為程式學習的交流場地,就像同學說的,一個人走得快,但一群人走得遠。雖然我無法常去,但其實我內心很開心,因為我感覺一個新生代的社群慢慢成形,而我也期待這個社群能如同 Huli 的初衷一樣,能在未來幫助更多想學習程式的人。

在這一篇章的最後,我要特別說一下,我的面試分為三個階段。

第一個階段,面試了六間,半個 offer 都沒有拿到,也就是上述的過程。

第二個階段,面試了四間,拿到了三間 offer

第三個階段,面試了兩間,兩間 offer 都拿到了

基本上我覺得第二和第三階段可以集合一起講,所以如果和第一階段對比的話,大概就是這樣 :

  • 第一階段 : 面試 6 間,拿到 0 個 offer
  • 第二階段 : 面試 6 間,拿到 5 個 offer

現在,你以為你已經看了長篇幅的心得了,但關於第二階段的部分,我會繼續說下去,也就是說,我的學習之路還沒有正式結束,所以請接著看。


七、重新出發

在理解了真正的學習之後,也是時候以全新的心情來面對面試這件事。

然而拿到面試邀請的第一間公司,就要做面試入門題,在秉持著「有人派作業給我好開心」這樣的心態下,其實做這份面試題時並不排斥,就在交出面試題過後一週以為沒望時,突然收到了面試邀約的回信。

這是我在六間面試中第一個拿到的邀約,也是唯一一間沒錄取的,但對我來說,整個面試還算是相當愉悅,由於這間公司的起薪也比較高,所以當時沒拿到 offer 的我並不氣餒。

順帶一提,這時候的我在履歷的投遞上,我已經開始只投遞自己想去的公司了。雖然沒有上這間公司,但因為此次面試所準備的面試題幫了我很大的忙,也間接催生了七天打造自己的 Google 應用這篇系列文。

另外也不得不說,雖然第一階段的面試半間都沒上,但經過每次的面試,我都能意會到自己是因為什麼原因落選,比如說不熟自己的履歷,白板題沒有好好表達自己的思路,甚至是面試時問錯面試官問題等等,當然最大的原因是那份自信,那份出自於自己實力的自信。

既然掌握了實力,自信也隨之而來,面試時的氣場自然也會不一樣。自己也漸漸發現,面試官不一定是憑藉你是否能回答出問題而選擇是否要用你,有時候,回答的過程反而更為重要,問題不總是在於自己強不強,而是人家想不想跟你一起當同事,畢竟當下面試的是應徵 Junior 工程師,而非 Senior。

「現在想想,其實你應徵 Junior 的時候不用想太多,因為更多時候,他們只希望你是個正常人就好。」 — 來自我一個工程師朋友的看法

常常聽人說,一個懂技術的 PM,會比不懂技術的 PM 更能掌握時程,那相反來說,一個懂得溝通的工程師,說不定才是公司最想合作的人。你可能聽過不少面試官都曾經說:技術不重要,技術可以學,我們更看重的是你的人格特質。

換位思考過後,求職的過程也越來越順利,很快了,我找到一間我想去的公司,我的轉職之路終於結束了。

但並沒有。


八、從求職到離職

面試四間公司之後,我選擇了我的第一份工程師工作,由於是博弈業,所以薪水高上不少,福利也相當吸引人,雖然地點遠在內湖,但後來想想,第一份工作辛苦一些是正常的。

在初入公司的時候,同事們都相當和善,尤其是 Leader 更讓我印象深刻,相當的暖,而且關於自己不懂的部分都願意從細部解說。前端 Team 的組成只有兩人,一個是我,一個是當初面試我的的面試官,不過很不巧,在我進去公司的第一週,就得知了面試官要離職的消息。

由於唯二的 Senior 要離職了,一開始面試時得知的一些前端技術棧,也有了變動,於是我開始學習新的框架,公司也沒有給予時限,感覺就像是一個快樂的薪水小偷,但其實並不是。

在歷經一些掙扎與詢問朋友的看法之後,我離職了,總共上班時間約兩個多禮拜。

如果離職需要提出一些確切的原因,那我得承認自己可能是對產品無法有共鳴與興趣,又或者希望當時自己能多用自己喜歡的技術,但我覺得更大的原因,是一個我也不知道該怎麼說的理由,所以我最後也是跟公司說,應該是頻率沒有對到。

那面試官的離職是不是間接造成了我的離職,我會回答,因為我認為,當時被公司錄用時,公司對我的需求,與面試官離職後,公司對我的需求,已經不相同。也正因為如此,我的離職,對於雙方而言,也都不失為一個重新選擇的機會,所以我選擇離開。

如果上述這些都不是理由,那也沒有關係,在這一篇章我想說的是,一切都只是選擇而已,我們只要為自己的選擇負責就好。

那這兩個禮拜學到了多少,我只能說太多了,除了了解實際上工程師到底是怎麼工作的之外,也見識到什麼是所謂的「公司專案」,即使是一個小專案,也都比自己在課程中最後一週的作業還大上太多,這些所見所聞,也都成為我之後面試時的重要參考。

最後,如果當時帶我的 Leader 有看到這一篇,我還是想跟你說,謝謝你,在我的這段路上,你絕對也是我尊敬也敬佩的前輩,期待未來我有所成長之後,還能有交流分享的機會。

至於細節,那又可以寫成另一篇故事了,但我想,勇敢選擇自己要的,也是一個成年人必須學會並體驗的課題之一。


九、從離職到再次求職

看到這裡,直接說結論,我又再次找到工作,並且要上工了。

離職後我面試後兩間公司,但由於疫情影響,所以在相對短的時間就做出決定。兩間都是我覺得很棒的公司,真的,在選擇的時候其實還蠻掙扎的。

或許你會想問,上一份工作的離職,對於下一份工作求職上會不會有影響?

我個人是覺得,做多久離職不是重點,重點在於當初做出這個決定的動機,以及在做出這個選擇之後,自己有什麼樣的領悟,以避免自己未來重蹈覆轍。

以我來說,我會回答:「每個人的舒適圈都不盡相同,我認為在職場上隱忍不說,是自己的舒適圈,但當時提出離職,除了代表我自己很清楚自己想要的是什麼之外,也證明了自己擁有跨出自我舒適圈的勇氣。」

但我會接著回答:「但我也明白,短時間內在職場上離職,除了代表自己在選擇工作時沒有考慮清楚之外,對個人和公司都不見得是好事。所以在此次階段的面試,我也跟自己做了一個約定,一旦決定了要去的公司,就會為自己的選擇負責,貫徹到底。」

很多事情,都是一體兩面的,關於自己的人生議題,一開始你可能只想到負面的點,但你可以嘗試翻轉看看,或許好的那一面,就差在你有沒有多想那一秒鐘。

嗯,明天就要上工了,給我多點祝福吧 XD

順帶一提,我要感謝推薦我去面試的同學,很高興有這位同學,我才能經歷這樣愉快的面試,與得到自己喜歡的 offer,謝謝你。


十、總結

從學習到結業,再從結業到求職,其實很多都是在講自己心路歷程上的轉變,但我認為自己想講的還有很多很多,如果在程式導師計畫第四期中,能給新進的同學一些建議,我會想將以下意見提供給你們:

第一個就是,課程的每一週都很重要

課程的每一週都很重要,說實話,我在第二週沒解開的那一道題目,到現在我學完課程已經幾個月了,那題我還是不會。

雖然每一週的課程都像蓋房子一樣讓你越來越進步,但在你是學生時沒搞懂的部分,出去工作後你也不會自然就搞懂,所以不要輕忽每一週的課程,也不要懷疑,有問題就直接去解開就對了。

第二,確定你搞懂每一個技術名詞

前五週教的非同步,說真的我到第二十四週之後才真正搞懂,Huli 有很多篇技術文章可以看,不懂可以直接看。

那些你重複看到的技術名詞,代表它應該是很重要的概念,如果當時沒有搞懂,但是當你學新東西時又看到,代表你應該先搞懂它,再去學新的東西。

換句話說,我覺得 Huli 的課程不會允許你有技術債,也就是說,如果有一個東西你不懂,到後面你還是會需要面對它。

第三,嘗試建立個人品牌

本來這邊我是想說建立個人部落格的,但我認為這樣的理由很難吸引剛轉職的新鮮人的寫文熱情,所以我覺得不妨,藉由自學來建立一個屬於自己的個人網站或是部落格,當然辨識度要更高一點,所以你可以畫一個屬於自己的 Logo 做大頭貼,好好經營,搞不好你可以變得比 Huli 還有名。

這真的不是我在吹,我認為一個從零開始的轉職者的故事,比一些已經是大神的技術分享文還要精彩得多,我自己是比較晚才意識到這一點,所以我覺得大家可以試試看。

第四,如果可以,多走出家門 (假如疫情結束)

如果程式導師計畫第四期也有實體空間的話,我會建議多走出家門多會會同學,有一天你會發現,社群與同學的相處會對你在職場上幫助很大。

我相信你肯定不是第一次跟同儕一起學習,但對於寫程式而言應該是初體驗沒錯,用工程師的角度與夥伴一起討論與問問題,相比埋頭苦幹會好很多。或許我也可以這樣說:你在課程期間是用什麼方法學習的,剛開始進公司時多半也會是那個樣子,沒有好與壞,但我是比較偏向喜歡討論的那種人,所以我建議多走出家門。

當然,前提是之後的疫情趨緩,甚至是疫情結束就是了。

第五,Final Project 不是絕對,但它是很好的練習與籌碼

由於自己沒做 Final Project,所以一開始面試時蠻沒信心的,但經過這些日子以來的面試,我想說以完成整個課程的同學的程度,即使沒做 Final Project 也一定找得到工作,只是公司的選擇多寡而已,這點蠻現實的,有些公司就是需要看你的作品。

但你也可以抓住這一點,把 Final Project 做得完整一點,並加入多一點巧思,讓自己對比其他求職者而言多一份籌碼。以個人來說,還是蠻推薦做的,但以程式導師計畫的程度,不做也還是可以拿到面試與拿到 offer 就是了,

第六,自信來自於實力,實力著重在概念與基礎

在面試時,面試官不大可能要你從頭做一份作業等級的題目,所以會簡短問你一些概念與技術問題,回答得好或不好,其實你自己最清楚。基本上課程可以涵蓋絕大部分的面試問題,如果有沒有涵蓋到的,基於你已經是結業的同學,掌握這些課程外的面試題應該也不難,研究一下就好。

我認為自信絕對不是對鏡子裡面的自己說說話就好,想提升自信,對於工程師來說就是搞懂問題並解決而已,最好是寫成心得或文章,給以後的自己參考。

寫成文章,代表可以量化那些你已經解決的難題,自信也會以一定的具體形式累積,你會發現自己越來越好了。受到挫折,你可以自我懷疑,你也可以沮喪,但真正重要的是,難過完你打算怎麼做?

對於工程師來說很簡單,解決問題,然後記錄它。

第七,重要的不是結果,而是過程

有一位醫生曾經說過:「人到最後一定會死,但死亡並不是人生的目的。」

你認為人生的目的,是什麼呢?

我認為課程帶給我的意義也一樣的。

起初我以為,完成課程之後,我掌握好技術了,我以為這些東西是對我真正重要的,但當時的我卻忘記了學習時的自己。

即使我學會了怎麼寫程式,也自以為理解那些技術,但我在面試時還是無法得心應手,我太在乎自己學到的那些技術名詞了,也就是說,我好像太在乎課程帶給我的結果了。

但在痛定思痛之後,才明白真正能使我成為工程師的,實質上並不是這些東西,而是這一路上雕塑我人格特質的這些磨練,與我對於程式設計的學習心態與精神。

我很喜歡之前看過的動畫裡面,描述的一段話:

「想要追尋真相的意志」才是最重要的,如果僅僅是想要得到「結果」,那人往往就會想要抄捷徑,而抄捷徑可能就看不見真相

重要的在於不是你何時結業,也不是你終究掌握了什麼樣的技術,而是這一路上,那些你走過的路,那個學習的你的內心,與那個想知道「為什麼」的精神。

唯有掌握這樣的精神,才能使你以後不論成為了工程師,甚至有一天前往別的領域了,它們都能維持你的熱情而不熄滅。

所以,對於最初 Huli 對我說的那句話,我的解讀是:

如果課程真的對你這麼重要,那即使被淘汰了,也沒關係。

因為真正重要的,是那顆學習的心。

只要掌握這顆學習的心,不論是否參與課程,都能有成功的一天。

我也想提醒正在學習的你,儘管自己不是本科系,但比起太多早早在起跑點衝刺而熄滅熱情的人,經歷過不同人生階段的你,經過一連串領悟後,實在的為自己的人生做了選擇,並且在這段學習的路上,掌握了真正對自己重要的東西。

這個東西不會給你最多最強的技能,但它會是你人生中最重要的燃料,這個東西對所有人來說都不一定相同,但對我來說,我在我這長達七八個月的學習歷程中,找到並發現了它,不知道該怎麼形容,只能簡單稱之為「過程」。

相對於結果,過程真的重要得太多,太多了。

然而,換個角度想,人生漫漫,有時我們認為的結果,又何嘗不是過程的一部分呢?


最後謝謝你看完這篇結構不算好,算是隨筆的心得,儘管篇幅是長了一點。

另外我也想說,這心路歷程結束後,感覺自己好像成了完人一樣,但其實也沒有,自己其實也是拖延症蠻嚴重,蠻愛耍廢的,人一生最大的敵人果然就是自己沒錯。

我想這就是身為人的副作用吧。

大概就是這樣了,謝謝收看。

學生心得:CindyLyu

背景

大學是行銷與流通管理系畢業,畢業後因為待的公司規模較小,也加上對自己定位不明確,所以做了行銷兼網站企劃的工作,後來學了一些繪圖及設計的技能後偶然也幸運的接到了設計的短期合作案,但對於未來要做什麼還是感到有些茫然。

之後接觸到了 動畫互動網頁程式入門 (HTML/CSS/JS)
所以在參加程式導師實驗計畫前,只有學過一些 HTML、CSS、jQuery,主要就是上面提到課程學到的,之前工作有用很基本的 HTML 搭配 Excel(當作編輯器的概念) 寫商品資料上架用。

高中讀資料處理科,學計算機概論、VB 程式語言及學習一點點網頁製作(用 Dreamweaver)這一段對於參與程式導師計畫大概只有一點點的幫助,像是了解程式是透過一行一行程式跑的及網頁會寫一些 hover 效果,而 VB 程式語言都是照抄老師給的 sample code 來完成課程學習(廢)。

然後英文、數學都不太好(不過英文真的很重要~)。

報名計畫

之前看到第二期的時候就很想報名,但因為那時候工作認為自己沒辦法每週付出 40 小時以上所以放棄,後來看到第三期開放時,覺得很興奮!也剛好還沒確定自己後續的工作,透過先前工作些微了解工程師們的工作形式以及上過 動畫互動網頁程式入門 (HTML/CSS/JS)
課程後認為能夠寫出一些功能和頁面很有成就感,比起以往企劃偏向規劃面的工作,能夠自己做出一些實際的內容是一件蠻踏實的事情,所以決定轉職。

雖然說是很興奮,但自己是個容易猶豫不決的人,當時除了前端工程師也想往網頁設計的方面發展,所以反覆看過第二期學生的轉職心得、查詢一些資料及私訊詢問 Huli 對設計及前端工程師的看法後,思考後覺得既然兩個方面都想碰,先學前端也沒關係,再算一下存款是否可以養活這些沒什麼薪水的日子後決定報名計畫!

參與計劃後的種種感想

- 很棒的同學

從最初看同學們的作業心得,也很佩服同學們的學習力,到每週作業或每天發報告後,看著來自不同背景同學的無私分享或是私訊提供想法及建議的,都覺得超棒也非常暖心,也很感謝能夠跟這樣的一群同學一起成長。

- 學習系統

很喜歡看大家每天在上面分享的報告進度,覺得比較真實的感受到是有一群同學都在同個計畫上一起努力成長,也因為 Huli 鼓勵大家也可以分享日常的內容,所以看著每個報告分享的各種事情也覺得很棒,很舒壓(要申明一下壓力都是自己給的XD)。

- 學習與吸收

上有些課程的時候蠻希望除了看線上課程也能夠有影片中使用到的程式碼可以看,因為有些課程使用到的程式碼是連貫的,上到後半段有疑問或是經過休息時間又或是金魚發生失憶的時候就會想看前面某個地方的寫法,上到後面 React 時這個心願更是強烈了。

不過事情都是一體兩面的,希望能夠有課程中使用到的程式碼可以看也反思是否根本是自己上課的專注度不夠,或是應該換個方式學習會比較好。

- 遇到卡關時

很偶爾遇到卡關時會很不知道問題點在哪,也會有點不知道要如何發問,整個很像一團霧一團謎,雖然會先將問題寫下來,也不會妨礙進度的話就會繼續學下去,好像就是傳說中的技術債,所以到後面學 React 時變得很卡關,一方面也是對於前面學的基礎自己好像沒吸收完全,造成後面學 React 時遇到很多問題,覺得之前遇到問題到解不出來要寫下來以後再研究的問題似乎就應該向 Huli 發問。

Huli 有時會開直播(沒算錯的話在這段計畫期間中好像開過六次),記得好像在初期的直播有聽到 Huli 回答有關卡關的問題,可以將大範圍測到小範圍去找出問題點在哪,來找出 bug,但那時候沒有什麼深刻的體會,後來在學習過程中遇到 bug 找不出問題在哪的時候就會有點氣餒跟心浮氣躁,越到後面好像比較能平靜的慢慢的找出問題點。

- 理解放鬆很重要

這是第一週的作業之一,我覺得這個作業實在是很重要!因為很常常卡關時就會困在裡面出不來,或是跟自己過不去的感覺,這時就很需要去做別的事情來轉換心情,雖然做別的事情也要小心不要回不來或是直接拖延症。

- 參考別的同學作業

每週交完作業後都可以去看其他同學的作業來學習,像是 Huli 改完作業會將作業寫的不錯的標上像是「值得參考」的標籤,所以通常都會直接去參考有「值得參考」的標籤或是有在關注的同學作業,但也發現自己看 code 的速度超慢,或是發現同學用了沒學過的技術,而無法好好在有限的時間學習完(不過時間分配也是自己可以調整的,問題大概也出在自己的時間管理不好)。

原本有想過建議 Huli 可以標個類似及格作業的標籤,這樣就算來不及學習完「值得參考」的作業也可以知道怎樣算是及格的作業,但後續也想著,這樣是否反而有畫地自限的感覺,所以沒有建議出去。

- 課程

在報名成功後,先去找課綱中前半段可以先預習的部分,像是 [CS101] 初心者的計概與 coding 火球術
到計畫開始後直到上完整個課程其實覺得人生都完整了(誤),應該說因為課程從基礎解題到前後端及部署,所以可以了解每個環節是一件覺得很完整也很棒的事情。

- 程式導師 Huli

看著課程影片的背景從白天到晚上,也想著這到底要錄多久才能完成這些課程,滿是感謝,感謝能夠參與這個計畫。

覺得 Huli 好像不只是程式導師,或許有一部分還是人生導師(?)每週的隨意聊,也不會去勉強大家,能夠找到自己的方向才是最重要的,或是後期找工作給予的一些想法都覺得很感謝。

- 課程後半段的 React 學習到之後面試

學到後期的前端框架 React 可能也是因為卡關,所以就開始有點壓力,但也一直告訴自己,就算這之後每一週都多延後一週也頂多延後一個月,距離計畫結束也還有一個月,無論如何就是多努力盡全力就好!

後來也只因為學 React 的第一週學習緩慢多學了一週,後續的 react-router 及 Redux 只有延誤個幾天,所以整體沒有延誤太多。

從學 React 到面試似乎比起以往來的有壓力,有點像是以前在學畢業後要開始第一份工作,也有一些自我懷疑的想法,像是自己真的有吸收進去嗎?能夠好好應用在工作上嗎?

如果回到剛開始參與計畫的我想做的事情

其實就只是自我檢討

我希望可以再勤奮一點,或是努力降低懶惰的發作,覺得在複習週好像更容易懶惰,儘管已經有寫筆記,後續在面試時發現很多東西都講不好,甚至發現自己根本沒理解清楚或吸收進去,所以認為應該將所學寫成文章,因為透過理解後再用自己的話寫出來似乎才是真正的瞭解。

所以在複習週複習時就應該把學習過的東西寫成文章,或訂一些其他具體的目標來驗證自己是否有吸收進去。

未來

或許對於未來還不是有一個很實際的方向與長期目標,目前的想法大概就是希望能夠將所學寫成文章,來督促並檢視自己是否有學習進去腦袋裡,再來希望能夠做 side project 來充實自己。

第十五週網站前後端開發基礎測試參考解答

這個 Issue 主要是第十五週會出現的網站前後端開發基礎測試的參考解答。

原本在 Google 表單提交之後就會有參考解答可以看,但一來修改內容不太方便,二來有疑問也沒辦法馬上討論,所以最後就決定在 GitHub 也開一個 Issue 來講一下解答。

如果有任何問題歡迎在下面留言,解完有收穫或是有寫成心得筆記也歡迎分享在下面。

底下解答都是點開才會顯示的,不用怕被雷到。

Q1

有天小明來找你,跟你說:

欸欸,主管剛出了一個作業,跟我說要我寫一個 Todo list 的後端 API,要回傳代辦事項的列表,還要能新增、編輯以及刪除 todo。

但是有一個限制,主管要我只能用 GET 這個 HTTP Method 來實作!開玩笑,這怎麼可能嘛,新增要用到 POST,刪除要用到 DELETE,只用 GET 怎麼想都是不可能的,你說呢?

請問小明說得正確嗎?
如果你只能用 GET 寫一個 Todo list 的後端,你做得到嗎?如果做不到,原因為何?

點我看 Q1 解答

答案:做得到。

這一題想考的是「慣例」跟「限制」的差別。

之所以刪除動作會用 DELETE,是因為這是一種好習慣,而不是因為「必須要」這樣做。所以儘管你只有 GET 這個 method,你依然可以寫出新增、刪除以及編輯的功能,只是網址就會不符合 RESTful 的規則,大概會變成這樣:

  1. add_todo?id=xx
  2. edit_todo?id=xx&content=xx
  3. delete_todo?id=xx

總而言之,HTTP Method 的使用本來就不是強制的規範,這題希望讓大家理解的是這件事,不過能夠符合 method 的語義當然是最好的。

Q2

承上,如果變成只能用 POST 這個 method,做得到嗎?如果做不到,原因為何?

點我看 Q2 解答

第一題講解過了,做得到。

Q3

公司內部有一個 API 是拿來刪除文章的,只要把文章 id 用 POST 帶過去即可刪除。

舉例來說:POST https://lidemy.com/deletePost 並帶上 id=13,就會刪除 id 是 13 的文章。

公司前後端的網域是不同的,而且後端並沒有加上 CORS 的 header,因此小明認為前端用 ajax 會受到同源政策的限制,request 根本發不出去,所以前端沒辦法利用 ajax 呼叫這個 API 刪除文章。

請問小明的說法是正確的嗎?如果錯誤,請指出錯誤的地方。

點我看 Q3 解答

答案:錯誤。

這題考的是你對同源政策的理解程度。

首先,同源政策限制的對象有兩種,簡單請求跟非簡單請求,前者像是 GET 跟 POST(還必須沒有加上任何 custom header),後者像是 DELETE 之類的。這邊可以自己去找 MDN 的參考資料來看。

簡單請求跟非簡單請求的差別在於:

  1. 簡單請求限制的是「拿到 response」而不是「發出 request」,這是超級無敵重要的一點,但我想很多人都會搞混

  2. 非簡單請求會先發出一個 OPTIONS 的 request 去查看後端是否允許非同源的 request,如果不允許,則不會把請求發出去。舉例來說,使用 DELETE 方法就會先發出 OPTIONS 的 request,確認後端有帶 CORS 的 header 才會把 DELETE 的 request 發出去。

所以,以這題的狀況來說,儘管後端沒有加上 CORS 的 header,刪除文章的 request 依舊發的出去,只是前端的 JS 拿不到 response,然後 console 會出現錯誤。所以文章還是被刪掉了,只是前端不知道到底有沒有成功。

Q4

有天小明表示他對 XSS 的防禦方法不太理解,他說:

不是啊,幹嘛要 escape 字串,既然 XSS 的問題是因為可以執行 script,那我就直接把 <script> 標籤取代掉就好了,例如說:str_replace(“<script>”, “”, html),這樣就不能執行 JS 了,不就沒問題了嗎?

請問小明的說法是正確的嗎?如果錯誤,請指出錯誤的地方。

點我看 Q4 解答

答案:錯誤

這題考的是你對 XSS 的認知是否太薄弱。

的確,照小明的說法 <script> 會被封掉,但是如果攻擊者把標籤改成 <SCRIPT> 就可以繞過這個字串取代了。

而且就算改成無論大小寫都會被取代掉,我依然可以不用 script 標籤執行 JS,例如說 <img onerror="alert(1)" /> 也可以成功執行 XSS。

Q5

小明在學習到 SQL Injection 之後非常興奮,他說 SQL Injection 就是靠攻擊者傳入惡意字串與原本的 query 拼在一起導致攻擊成功,只要用 prepared statement,交給資料庫來處理這些惡意字串就好。

以 PHP 為例,就是像這樣:

$stmt = $mysqli->prepare(“SELECT * from Todos where id = ?”)
$stmt->bind_param("i", $id)
$stmt->execute()

這樣子就能防止 SQL Injection 了!

請問小明的說法是否正確?如果錯誤,請指出錯誤的地方。

點我看 Q5 解答

基本上是正確的,除非哪天 prepared statement 被發現漏洞。

Q6

在公司內部有一個留言板的系統,必須註冊才能留言,而且只有自己能夠刪除自己的文章。在前端的實作上為了確保不能刪除到別人的文章,只會在自己的文章旁邊顯示刪除按鈕。

而後端則是一個簡單的 API:DELETE /posts/:id。程式碼大概是長這樣的,就只是依據傳進來的 id 把文章給刪除掉:deletePost($id)

小明覺得這樣沒什麼問題,既然前端不會顯示刪除文章的按鈕,就不可能刪除到別人的文章。

請問小明的說法是正確的嗎?如果錯誤,請指出錯誤的地方。

點我看 Q6 解答

答案:錯誤

這題考的是你對前後端的理解是否正確。

前端歸前端,後端歸後端。任何人都可以發 request 到你的後端程式去,帶著任何的資料。

儘管你前端把按鈕藏起來,但沒人可以阻止我自己發 request 到後端。因為後端沒有做權限驗證,所以我只要自己發 request 過去,就可以刪除任何文章。

記住,後端的權限管理是一定要做的。在處理 CRUD 時要特別注意到權限管理這一塊,不要讓使用者能夠改到其他人的東西。

Q7

小明正負責寫一個專案,網址是:https://best-project.com 。這網站會需要用到公司網站某個檔案,裡面是一些使用者資料,例如說:https://lidemy.com/users.json ,小明直接點開這個網址,發現用瀏覽器可以看到內容,於是就說:

既然我用瀏覽器可以看得到內容,那用 Ajax 的時候也一定可以拿得到資料啦!我們來用 Ajax 拿資料吧!

請問小明的說法是正確的嗎?如果錯誤,請指出錯誤的地方。

點我看 Q7 解答

答案:錯誤

可以用瀏覽器直接打開網頁是一回事,但用 Ajax 又是另外一回事。我可以打開 Facebook.com,不代表我可以用 Ajax 拿到 Facebook.com 的內容。這完全是兩回事,是完全不相干的事情。

同源政策限制的是 Ajax,而不是你在瀏覽器上面直接造訪網站,這兩者是完全不同的。

因此這個網址的 Ajax 會受到同源政策的限制,可能拿得到也可能拿不到,要看後端有沒有帶 CORS header,所以小明說「一定也可以拿得到」是錯誤的。

Q8

公司要小明負責寫一個會員系統,小明在實作註冊與登入功能時,想起以前前輩教的事情,那就是在把密碼存入資料庫以前必須先經過 hash。

於是小明使用了 bcrypt,密碼在存入資料庫以前都會先使用 bcrypt 來做雜湊。

請問小明的做法是正確的嗎?如果錯誤,請指出錯誤的地方。

點我看 Q8 解答

答案:正確

bcrypt 是雜湊的演算法之一,大家要記得絕對不要存 plaintext 的密碼進資料庫喔!

Q9

小明寫了一段程式碼,希望能在網頁載入完成時執行一個 function:

function start() {
  console.log('網頁載入完成')
}

window.onload = start()

而小明在網站載入成功後打開 console,發現文字的確有被印出來。

請問小明的程式碼是否有問題?如果有的話,為什麼文字還是被印出來了?

點我看 Q9 解答

答案:有問題

這樣寫是代表要把 start 這個 function 執行後的結果傳給 window.onload,所以在網頁還沒載入好時其實就會執行 start()。

正確的寫法應該是 window.onload = start

Q10

小明在執行程式的時候出現了一個錯誤:Uncaught TypeError: Cannot read property 'selfId' of undefined,但百思不得其解,不知道是哪裡出了問題,以下是出錯的「部分」程式碼:

const result = list.filter(item =>
  item.parent.id === matches[0].parent.id &&
  item.parent.name === matches[0].parent.name &&
  item.selfId === homeData.selfId
).sort(
  (a, b) => a.typeId - b.typeId
);

根據你的推理,會出現這個錯誤的原因是什麼?

點我看 Q10 解答

這一題是我覺得最好玩的一題,考驗你對 JS 錯誤訊息的理解。

你可能會認為說:「不對吧,你很多資訊都沒有給齊,這題怎麼解?狀況很多吧!」

讓我來幫你解惑,首先你可能會答說:「homeData 上面可能沒宣告」,但如果是這種狀況,錯誤訊息就會是 ReferenceError: homeData is not defined,所以這種狀況可以排除,代表 homeData 一定有宣告。

同理,matches 也一定有宣告,不然錯誤訊息會不一樣。

再來,錯誤訊息告訴我們說:Cannot read property 'selfId' of undefined,代表我們試圖對一個 undefined 讀取 selfId 這個屬性。

出現 selfId 的是這行:item.selfId === homeData.selfId。

如果 item 是 undefined,前面 item.parent.id 時就會出錯,所以 item 是沒有問題的。

因此,會出現這個錯誤訊息的原因是 homeData 是 undefined。

學生心得:yakim-shu

背景介紹

做了三年的網頁設計師,工作內容算是網頁設計、前端開發各佔 50%,所以算是本期學生中少數有工作經驗的,但因為覺得自己的能力跟經歷不成正比,擁有的工作經歷不像是優勢,反而像是種枷鎖。之後去澳洲流浪了一年,有意識的拋開跟程式有關的一切,想要過嘗試更多可能性的人生,回來又繼續欒樂了好一陣子。

本來為回到職場的計畫是:列好要精進的領域、以看線上教程的方式自學,後來看到 Huli 第三期的課程大綱跟發現寶藏一樣開心,毫不猶豫立刻就報名。

那時為了想要心無旁鶩的自學、精進前端技能,還鼓吹男友跟我一起搬到了遙遠的恆春,試想著在沒有人會打擾的地方專心學習,幸運的是每次做超脫常理的決定時,身邊的人總是無條件支持我。

用 MBTI 人格理論來概略分類的話是 ENTP。 ( 單純跟風 )

報名目標

我不知道其他無經驗的同學是怎麼看待課綱的,但我當初看到課綱涵蓋著前後端、包括效能優化跟資訊安全、框架應用,簡直豐富的不可思議,去外面工作個一兩年也不見得能全部碰到,尤其如果是待在大公司專注在某一領域,很難退一步用更廣的視野去理解開發工程。

儘管課程內容很豐富,我還是覺得最好的學習動機來自於需求,以自己以前的自學經驗來說,沒有實踐的學習會讓我很茫然,我可以透過課程了解一個理論或規則,也知道工具能拿來做什麼,但如果沒有實務性的應用,會感覺像是浮在空中一樣不踏實,所以我覺得能從工作中學習是最好的,當初是希望能透過課程將自己訓練成一個 "基本技術門檻能過關" 的工程師,然後讓我可以進去一個理想團隊繼續學習。

當初的報名信是這麼寫的:「 我的目標是希望可以進入有一直在『 求進步 』的團隊,理想是達到他們開的需求的 60-70%,剩下的 30-40% 是讓我成長的空間。 不知道聽起來是不是有點妄想,但至少我相信不是不可能! 」

所以當收到報名成功的信真的超開心,因為我本來就有在長期關注 Huli 的文章,是個鐵粉來著。目前以結果來看,不僅是達成當初設下的目標:一張進入理想團隊的門票,還有更多意想不到透過課程得到的收穫,與同學、Huli 的互動,以及實際吸收到的開發技能,完全超出我預期。


課程內容

關於技術跟工具就不多著墨,以下記錄我特別印象深刻的過程。

前期( 1 - 10 week )

這段期間都待在恆春,過著每天早上督促自己去圖書館待著,傍晚去**,持續看課程寫筆記的日子,完全是人生的健康高峰期,也因為作息如此健康,也是學習效率最高的時期。

我很喜歡第一週的超級挑戰題,初次感受到 CLI 的無窮威力,第五週也因為看同學作業的流程覺得有點麻煩,自己試著寫個半殘的抓作業小程式,儘管之前也工作了一陣子,但這時藉由這個練習才真正體會到原來「 用程式解決問題 」是怎麼一回事,雖然結果不盡人意,但那種從「 發現問題、分析如何利用現有的技能解決、實際動手 」的過程真的是,無與倫比。

這期間都算是在跟之前的工作經驗中有些交集,所以算是半個舒適圈,常聽到同學覺得自己是切版苦手,我算是比較有經驗的,但好像也給不出什麼好建議,大概就是練習吧,在切板切到想吐中成長,如果感到痛苦,那就代表你做對了。

中期( 11 - 20 week )

課程進入我超期待的後端部分,我感覺 PHP 是一個很直接的語言,留言板作業會用到的功能都不算太難,但也可以很明顯發現當網頁的架構越來越大,原本的寫法應該會很悲劇,可惜後來因為時間關係把後端的框架先跳過了。而連續好幾週的留言版算是作業中比較完整的練習,很慶幸那時挑戰題都有做,最後還可以拿來當面試作品。

接著搬回家住的這段期間,學習品質算是時好時壞,尤其在 14 週部署的時候因為充滿挫折,卡在一個跨不去的檻真的讓人動力全失,也經歷過一段學習黑暗期,還好跟朋友聊過之後舒坦許多,有時候真的需要別人拉你一把,我想能好好的把遭遇到的困境描述出來,就是走出困境的第一步,也感謝那時 Huli 剛好給了我一個合作的機會 - Lazy Hackathon。

感謝這個有趣的機會,需求是做個任意主題的 landing page,因為是從零開始的東西,除了要放很多圖片跟很慢之外的要求,沒有任何限制,是個目標明確且掌握度 100% 的專案,從主題、設計、文案、切版都做得很開心,可能因為是自己的孩子,所以之後的優化作業也是拼全力執行,且也多虧當時的用心,這份優化作業在之後的面試中很常被提到也給予肯定,真的要再次感謝 Huli。

另外 17 週的 JavaScrtip 原理讓我大開眼界,原來探究技術原理可以深入到種程度,Huli 文章背後的研究精神是我學到最多的地方。

後期( 21 - 24 week )

終於進入最後階段的框架 React,自己以往就是一個 jQuery 工具人,能體驗不同的思考模式我覺得很興奮,而的確就像 Huli 說的框架是入門最難,而其他更多的只是熟悉框架的規則與習慣不同資料流動的方式,在學 React 的時候不是靠先理解才使用,而是在使用工具的過程中一邊理解為什麼要這麼設計,從練習中又多打通一點,很好玩。

而學到 Redux 也是第一次感受到,乾這東西怎麼這麼難,很抽象又難理解,看了各式教程才真的慢慢有點頭緒,窺探到日漸複雜的前端開發是怎麼一回事。


課程跟自學的差別

以前也有許多自學的經驗,自學的問題某一部份在於很難評估學習成效,也很難知道什麼規模的練習適合自己的程度,換句話說就是目標很模糊,也就難以提高成就感。

而課程跟自學最大的差別的在於,每週都有一個明確的短期目標 - 作業,對於每週的成效評估有個很客觀的標準就是把作業完成,還有很好玩的挑戰題可以嘗試難題,跟更重要的即時 feedback,寫作業的很大一個動力是 code review,想到會有人看我的程式碼就覺得很興奮,也會更認真寫,最後另一個意想不到的是來自社群的規範力,看到別人拼命就覺得自己不能再耍廢了。

關於自信

這是一個很難的課題,而且在面試的模式中尤其重要,先說如果是論外在表現的話,我覺得要表現出有自信的樣子不難,難的是你要怎麼打從心底相信自己其實不錯,或許從好好了解自己開始。認清自己哪些部分做得不錯,又有哪些地方需要加強,清楚自己的定位,如果把自己的長處當成理所當然,且同時無限放大自己的短處,那可能不管變得多強都無法相信自己很強這件事。

我不覺得自己是個沒有自信的人,但如何盡可能縮小外部評價跟自我評價的差異,也還在慢慢摸索當中,可能訓練自己接受批評的心理素質要再強大一點,當陷入學習深淵時,總會想起一句在 podcast 聽到的話激勵自己:

「 沒有我不會,只是還沒學會 」


成就感 & 挫折感

在長達半年多的學習過程中,當然也不乏出現很多成就感跟挫折感的情緒,且時常是並存的,成就感的瞬間經常是歷經挫折得來的階段,像是拼命寫的作業卡了超久,但看到最後的成果還是會挺開心,也會想跟朋友分享( 儘管他們看不懂 )、或是在寫挑戰題時心情總是有點雀躍,這是比較幸運的時候。

而有些就挫折,就單純只是挫折而已。

像是自己拼了命的往一個方向衝,而最後只看見一條死路,掛著「 此路不通 」的告示牌,沒有厲害的沿途風景,也沒有覺得自己從這條路上快速成長,在第 14 週部署的時候就有這種無力感。

學習方法

其實我覺得自己的學習方法效率不佳,就是大量找資料、了解大家是怎麼去解釋同個概念,並整理出自己消化過後的重點,輸出成一篇篇筆記,就這樣。

至於為什麼說效率不佳,因為寫筆記要耗掉大量的時間,所以有關如何有效率的學習推薦看這影片:How to study for exams - Evidence-based revision tips

但做筆記額外的優點是,以自己的經驗來看,有經營技術 Blog 在面試時真的大加分,先不論內容的品質,能夠有毅力的持續做這件事,某種程度可以代表你學習能力跟熱忱都不算差的證據。


求職歷程

在找工作的時候,總覺得自己的「 實力 」無法說服人,只能靠更多的「 誠意 」,履歷的呈現方式從開始求職前兩個三月就開始搜集資料,參考許多不同大大的履歷才大概有個雛形。

課程上完後日本耍廢回來,大概花了三天把線上簡歷弄完,就開始投履歷,走的是海投路線。

如果單以結果來看,找工作算是挺順利的,投 65 間中有 17 間邀約、最後面了 13 間,撇除 2 間因為面到心累就放棄後來的二面流程,收到不少份 offer。

雖然現在說的雲淡風輕,但面試順利可不等於輕鬆,過程中的壓力大得超乎我想像,可能面試對我來說,某種程度上變成參加導師計畫的期末考,任何一次的失敗都像個標籤,變相得否定這半年的努力,當然理智上知道這種想法並不合理,但還是不免往這方面去想。

自己有哪些價值,在面試馬拉松的過程中發現有更多層面的解釋,絕對不單單是看 offer 上的數字來定義。

從面試中學習

我絕對相信面試也是一種學習,印象深刻的是在某一次面試中,對方說了如果你工作一陣子之後,在工作中可能會有七成的任務是很有把握的,意思是不需要查資料就有信心可以把工作完成,那這時候你會怎麼去看待這些可能學習不到太多新技巧、成長幅度不大的任務?

面試官說:「 我自己的做法是,不停得去想怎麼寫會更好、或讓程式碼效率更佳,有追求『 更好 』的想法,才是進步的原動力。 」

求職期間遇到很多很有誠意的面試官,真的非常感謝他們,給我許多回饋與職涯上的建議,雖然面試壓力很大,但還是一段令人感恩的過程。至於該怎麼選擇未來的公司也是一大難題,感覺每個選擇都各有優缺,憑著面試期間兩三小時交換到的資訊,很難了解哪一個最適合自己。

最後選擇了產品我也很喜歡的公司,就像其中一個面試官對我說的:「 前端工程欲漸複雜,因此選擇你真正喜愛的產業會讓自己更能堅持下去 」,雖然寫 APP 等於是又轉換了跑道,但我想到可以跟朋友分享自己開發的產品就覺得滿心期待。


課程社群

很感謝有每日進度系統的存在,沒有動力的時候看一下同學在幹嘛,開心的時候在上面發個廢文,有學習心得的時候也可以去上面分享,是我理想中的社交平台,不用在乎有沒有人看,又是怎麼看待我這傢伙怎麼一直在上面發廢文的。

看到同學們一起卡關,有時候也會蹦出一些爆笑的互動,這半年說孤單也是挺孤單的,整天一直關在 Mac pro 的小小螢幕裡,而進度系統是唯一的心靈綠洲,超級喜歡。偶爾看到厲害的同學會想知道他怎麼辦到的,會不甘心、會想變得更強,偶爾失落但幾天後還是可以站起來繼續前進,學習是個充滿荊棘的路,當下只會覺得走得很痛苦,回頭才發現肌肉長出來了,練好的肌肉會讓下一條路沒那麼辛苦。

最近因為常去小樹屋的關係,有個空間可以讓同學聚在一起,平常各忙各忙的用電腦、偶爾解解 leetcode、分享面試經驗、講講幹話,讓線上的互動移轉到線下,讓邊緣如我好像多了一些朋友,樹屋真的是個很溫暖的空間,希望工作後還可以一直延續下去。

感謝 mentor

最後真的萬分感謝 Huli,雖然課程中的互動沒有很多,但最後找工作階段非常謝謝 Huli 不斷得給我建議也一起討論工作如何選擇,不只是 mentor,也是個人很好又很強的朋友。

雖然 Huli 對同學走一個放牛吃草的路線,每週的隨意聊都是帶些雞湯以及反雞湯,總說不喜歡強迫學生要加油,但很神奇的還是會鼓勵到大家,很喜歡課程用心安排的每個環節。目前好像不會有第四期了,能作為第三期的學生非常感恩,參加課程是我 2019 年最超值的決定。

最後來個真雞湯,引用自很喜歡的 Bojack Horseman,主角在第二季練習跑步跑得很痛苦的時候,路過跑者對他說的話:

It gets easier. Everyday it gets a little easier. But you gotta do it everyday, that's the hard part, but it does get easier.

學生心得:julypenguin

背景

大學與研究所都是營養科系,出來工作的這幾年也都是從事營養師的工作,對於程式只有自學 JAVA 的一點點基礎,大概就是知道變數是什麼,然後如果看著書的話有辦法寫出 for 迴圈這樣,但要寫 function 的話沒辦法,因為我不知道怎麼呼叫 function (驚!

因為已經出社會很多年了,不像剛畢業的大學生們有這麼好的學習力,再加上小孩才剛出生一年,處於一個不是很愛睡覺又開始會走路當跟屁蟲,很多因素都會阻礙學習~如果有小小孩的人可能要有心理準備,這個過程會非常辛苦,我覺得這辛苦的感覺甚至比以前我早上上班,晚上加班,深夜還要自學東西時的感覺更加疲憊

報名計畫

會知道 Huli 是因為一開始對程式有點興趣想自學的時候有購買了 hahow 的「初心者的計概與 coding 火球術」,講課的老師就是 Huli,當初看到這個標題時我完全不知道這個是教程式的,太抽象了啦,不過看了介紹後我還是買了下去,之後就是跟著下架公告一路把 Lidemy 的平台和粉絲團加一加,也在那個時候發現有「程式導師實驗計畫第二期」這個計畫,不過一開始我並沒有點進去,因為我以為是在培訓工程師成為導師 XDD,但每次打開 facebook 的時候都會跳這個計劃出來,有一天在蹲廁所的時候就打開了,這就是我需要的阿!天啊,裡面的介紹~雖然我全部都看不懂,但是我可以感覺的出來這可以學到非常多!而且是有架構的學習,還有更重要的是可以找到工作來轉職看看~

不過我已經是一個生技公司的大主管了,上面只有老闆,下面的人要做事也必須要經過我的核准,我沒辦法說離職就立刻離職,所以就把想參加「程式導師實驗計畫第二期」這件事先擱著,雖然擱著,但我也跟老闆說明未來如果有第三期計畫我有可能會離開,就這樣花了半年多的時間把人員訓練好並把權力下放之後「程式導師實驗計畫第三期」真的就出來了

但說真的,一開始我覺得這個報名條件有點嚴苛就是了,很怕自己底子爛到不行連基礎的門檻都跨不了而被刷掉,超級緊張

  • 門檻 1: 用 Scratch 做一個作品,我直接參考「初心者的計概與 coding 火球術」來做,稍微修改一點東西而已,但又很怕 Huli 看到噴火龍會覺得這學生太混了不用心想刷掉,所以花了很多時間做一點小修改,但還是做得很爛就是了...
  • 門檻 2: 用 Codewar 平台解任意三個題目,這個平台加入會員會有一個小測驗,一開始我連會員測驗都過不了,覺得這真的有夠考驗,後來 google 答案之後通過了測驗,緊接著又要完成 3 個題目,當然我就是依照這篇的難度選最簡單的零顆星去解,題目不夠 3 題的部分當然就是用 1 顆星去補,但說真的,當時 1 顆星我也是卡住,想學程式的報名門檻太高了啦 QQ,經過一番波折後解了 3 題,解了什麼我已經忘了,但我肯定一定是裡面最簡單的 3 題
  • 門檻 3: 每週必須花 40 小時來學習,有小孩的干擾一週肯定不會有 40 小時,所以就沒辦法讓家人知道我離職了,不過小孩健保綁在我身上,所以我也知道這沒辦法瞞多久,因為下次繳保費時大家就會覺得奇怪了 XDDD,但至少能完整學習一個月~
  • 門檻 4: 這其實不是門檻,只是我填報名表單時很猶豫要填什麼的困擾而已,就是表單有一欄問說「是否有程式相關背景?」,一直在想如果我很誠實的回答「沒有耶,我只知道變數是什麼,但光解決 Codewar 的題目我就快往生了」,不知道我是不是就被刷掉了,太爛了會拖累成功就職的達成率,後來想想不能填這樣,所以印象中我好像填了「我聽過 HTML、CSS」之類的回應,因為我真的有聽過這些名子,只是我連最基礎的 <div> 都沒聽過而已,CSS 更不用說了 XDD

但好家在,我錄取了!

正式參與計畫

第一週是最快入門的一週

第一週是學習 Command Line 與 Git,其實 Command Line 一點都不可怕,可怕的是 Git,因為我怕寫完作業後不知道怎麼交 XDD,現在想起來其實還滿蠢的,但之後每週我交作業前都會戰戰兢兢的回頭看 git 筆記,確認都沒打錯成功 push 上去後我才會鬆一口氣

學習的第 1 個月

因為有一個月不用顧小孩的完整時間,所以一開始的每一週我都是以完成 2 週的量為目標,也真的有達成,但時間的壓迫下沒辦法花時間看同學寫的每日心得及交作業的情況,感覺就是活在自己與時間的競賽裡,每天醒來就跑去大圖書館瘋狂 2 倍速看影片,2 倍速做筆記,2 倍速動腦寫答案(自己認為啦),第一個月結束後進度完成到第 7 週,沒完成到第 8 週是因為當時第 5 週是複習週,覺得老師既然刻意做複習週那我就認真的複習完 1 週好了,但因為時間很珍貴,所以其實那週滿焦慮的,但也許有那週狂寫程式邏輯吧,所以有覺得之後的思考速度好像快非常多,接著的下個月會說明為什麼會覺得快 XDD

學習的第 2、3 個月

第二個月我就跟家人說我離職了,開始一邊要顧小孩一邊要學習,晚上陪小孩睡著後我還會繼續爬起來寫到凌晨 2 點左右,時間雖然被壓縮但還可以大概一週 25 - 30 小時左右吧,我覺得還行,而且我已經度過學習知識量最爆炸的 HTML 和 CSS 了,那部分真的學習有夠疲憊,但因為這個月開始時間都太零碎不穩定,之後的作業都跟著週數一週交一次,不過因為陪小孩玩的時候可以偷看一下別人的心得和作業,這時才發現別人的作業後面竟然會有「值得參考」標籤,原本很想要這個標籤,認真一週後發現全心全力寫了作業也還是拿不到就放棄了,而且開始進到 MySQL 和 PHP 的另一個奇幻世界,但很特別的是從作業第 9 週開始,大概第 2 天就能把作業完成,雖然每週的總時間減少了,但我每週卻多出了 3 天可以好好的去看文章查資料,覺得這應該是第 5 週複習週的大量思考讓我後續寫程式碼思考的速度變得快很多~

這個月因為因為沒辦法跑去大圖書館寫作業(太遠了),所以就趁小孩下午熟睡時先托爸媽照顧,然後跑到家裡後面的超小圖書館寫作業,但那圖書館網路實在太爛了,已經不是慢不慢的問題,是它網路會整個死掉(每天都會發生),也體會到新手工程師在沒有網路的時候有多麼無助,而我的手機沒有吃到飽不敢給電腦吃網路,第一天遇到斷網時就摸摸鼻子回家了,當時太嫩了,有些問題實在無法自己解決,連網路上的筆記也沒辦法查,隔天開始就把所有我認為當天會需要用到的資訊先查好,網路斷掉後至少還有辦法做作業~久而久之也漸漸習慣寫作業沒辦法用網路查資料的生活了~只是每次要交作業還要回家才能交,覺得有點小麻煩

學習的第 4、5 個月

第 4 個月我開始做第 18 週的作業,印象很深刻,從這週開始小孩就不喜歡睡覺了,而且一遇到不滿意的事就開始鬼吼鬼叫,我每週的時間大概被壓縮到一週不到 15 小時了,幾乎就是星期 1 - 5 每天的熬夜時間,看完影片後能寫作業的時間剩非常的少,但因為陪小孩時會偷偷利用時間看一下同學的程式碼 ( 其實有點盲看的感覺,就是要用手機看網站畫面同時看程式碼會非常不方便,所以就不看畫面了,直接看程式碼寫什麼,大概想像一下這是什麼功能,順便學習一下別人厲害的寫法這樣~),但也發現自己的程式碼有幫助到其他同學感覺滿欣慰的,因為「值得參考」這個標籤實在太難拿到了,一值覺得自己的程式碼是不是很爛 XD

緊接著就是學習框架,我選擇一次把前後端框架一起學習,因為覺得找工作前如果前後端都會感覺很加分 ( 自己感覺啦 ),而且自己的進度並沒有因為時間減少就落後,既然進度超前那就一起學吧 XD,大概在第 5 個月結束時完成了所有作業,回想起來覺得好辛苦啊~~一直好羨慕別人擁有這麼多的學習時間,而我只能緊促的學習,不過在學習完之後自信心就開始膨脹了~覺得好像各種前端有職缺薪水不低的話都可以去試試看 XD

面試

我學習完一放鬆就立馬抓著老婆小孩飛去韓國和日本玩一個多月,而且因為課程剛結束實力正堅強,馬上就做個部落格把行程和 GOOGLE MAP 定位都放上去方便找地點,也當作後來面試的作品,原本出國前 Huli 說可以花一兩個禮拜丟一丟履歷看能不能面試個 10 間,不過小孩實在太黏人了,有時候真的打個鍵盤都沒辦法,最後出國前我連履歷都沒用好 QQ

出國回來後家裡又發生了一些事,所以除了照顧小孩之外,又多了外婆要照顧,就這樣一個月又過去了,某一天 Huli 問我說有沒有開始找工作時,我突然覺得自己是不是連 React 都忘記怎麼寫了,在答應 Huli 要開始找工作後就直接把 Huli 的影片當音樂在播,小孩也一起聽,順便也一起投履歷,在播到第 2 天時有一間公司打電話來問我要不要去面試,當然好囉~想說就當練功,面試當天過程滿順利的,工程師說話的感覺就和我現在在公司感受到的感覺一樣,很有親和力,而且很有實力的感覺,所以面試一間就決定去工作了~目前待了 5 個多月~上完 Huli 的課程之後來工作真的綽綽有餘,我覺得很夠!不過工作後還可以學到一些寫程式的小技巧就是了,但那只是加速寫程式的速度而已~

整個計畫的感想

其實寫程式很快樂,但也很辛苦,因為我常常會遇到寫程式的一個枯躁期,就是前一天明明還很有熱忱在寫程式上面,但隔天就變得覺得寫程式很麻煩,懶散不想面對,而且又會持續個 3 - 5 天,幾乎每一個月都會來一次,跟女生的 MC 差不多吧,滿準時的,這個時候我就會去看看別人的心得,看著別人無比的認真而自己卻是懶散的心,就還是會想要讓今天有一點點進度,覺得有每日心得是後期支持我每週進度不落後的一個很重要的動力,後期真的覺得疲憊到不行了

可以看到別人的作業也是對我來說很重要的一環,每天都只想著怎麼用程式碼讓特定功能實現,但永遠都是看自己的程式碼,思考邏輯都一樣,雖然看別人的程式碼會看的很慢,而且也不一定看得懂 ( 因為我很常都沒看畫面...單純看程式碼 XDD ),但有時候還是會看到自己喜歡的東西,有時候還會有高手同學把大家的程式碼整理起來,受惠大家 XD

真的很慶幸能參加到「程式導師實驗計畫第三期」,原本覺得自己學程式也不一定學得起來,只是單純有興趣而已,但到現在已經有辦法自己寫前後端,不會的東西有辦法自己找資源,就算遇到 Bug 好像也沒有什麼會卡很久的,連同事遇到問題也是看一下大概就能猜到問題在哪裡,跟著課程走底子一定是夠,剩下的就是如何精進自己吧~

學生心得:prince811009

《程式導師實驗計畫第三期》課後心得

學經歷與背景

畢業於一所半文半理的學系,其中學了管理、學了醫療、還附贈資訊的課程,若要說學期中修過的資訊課程,其實百分比可能有接近四分之一,包括計算機概論、資料結構以及資料庫,不過大學中的課程都是以概念為主,比較少深度的探討理論或是實作等等,因此這些概念也大多都快要從大腦的記憶中消失了。

大四下畢業前夕,開始有了就業恐慌症,情急之下,找了一項一畢業就能有”不低“薪的工作,因此踏上了公職不歸路,努力拼了四個月不吃不喝不睡,終於考上並分發到公立醫院,在花蓮這好山好水的地方過了三年養老生活。

接觸《程式導師實驗計畫第三期》的契機

雖然在好山好水之處,生活過得很是悠閒,但是自己每天還是無法克制的去想,這是我要過的生活嗎 ? 因為蠻了解自己是一個非常需要持續有目標,才能一直有動力的人,且有目標才會努力衝刺,常常埋頭苦幹到無法自拔的程度 (XD)。因此我也積極的尋找和嘗試任何我想學習的領域或技能,當作我的下一個目標,因緣際會看到了 Huli 的相關文章,一方面是開啟了我對於前端領域的興趣,深深覺得 Huli 大大能把如此困難的技術或是概念,說明的非常淺顯易懂,也讓我迅速地了解前端這個領域的概念和雛形 ; 另一方面是這項計畫也點燃了挑戰欲,希望自己可以跟著這項半年的課程,有個對於前後端完整的概念,並且挑戰轉職成功。

正式開始的痛苦課程之路

雖說興趣是一動機,但是實作上單靠燃燒熱情仍然是一項困難的挑戰。課程規劃從四月中旬開始,但此時身邊還有正職工作同時進行,因此都極盡運用每個時間點上課和實作,再加上萬事起頭難,許多課程和概念要開始進入狀況並不容易,因此雖然前期課程算簡單得多 ( 與後期課程比較 ),但是所花費的時間並沒有減少太多,很多概念第一次聽都是霧颯颯的感覺,並且在心中有十萬個為什麼不停的在疑惑。

第一次複習週(week1~week5)

可以說是課程的蜜月期,老師先帶我們認識和熟悉程式以及網路的基礎,這部分大概如果認真上完課或是做筆記,大致上作業的部分沒什麼問題,也算是先做個暖身以及先建立一些信心。

第二次複習週(week6~week10)

這邊遇上了第一次的卡關週,可能因為前五週的課程比較少牽涉到邏輯的部分,因此在第七週練習寫出簡單遊戲和計算機的時候,腦袋一直無法轉過來 XD。這一階段也讓我深刻體會到一點,也就是就算聽課程的時候,覺得自己都聽懂了,甚至覺得“其實也沒那麼困難”,但實際上,當自己開始著手寫作業的時候,才真正應證了自己對一個概念有沒有完全了解,或是有沒有能力去運用它。所以這週的作業足足卡了一個月,沒錯,在這麼前期就卡關了這麼久~雖然也持續研究其他同學的程式碼,但是就像解數學題一樣,看懂了是一回事,但是解的出來又是另一回事。最後雖然半拼湊半猜半嘗試把作業寫完,不過心裡感覺不是那麼踏實,覺得並沒有抓到 coding 的感覺 。不過這段時間很幸運的,得到一份前端的工作,可以提早體會業界所使用的工具以及技術,也和團隊一同完成專案內容,一方面也是強迫自己一定要趕緊學習,並且讓自己幾乎全天的時間都浸潤在這個領域中,學習也好,耳濡目染也好,也可以有個具體的感覺知道自己還差真正的前端工程師多少距離。

第三次複習週(week11~week15)

歷經上一次複習週 JavaScript 的摧殘,心裡默默期待接下來會是比較溫和的課程,不過是我太天真了,真正的核心課程陸續端出,只能跪著繼續把課程跟完。而我覺得這課程最困難的部分,就是課程是連續的編排,因此如果前一週沒有完成,其實到了下一週還是需要把這些概念補齊。在這段課程主要為建立一個完整的留言板,一開始覺得前端的課程為何需要學習到後端的概念,甚至還需要學 php 這一項新的語言,但後續完成這段課程之後,才知道大大的用心所在,因為了解一個完整作品的前後端流程、概念、和所需工具是非常重要的,後續與工作團隊的合作,也更能夠快速進入狀況,或是和後端同事進行溝通,這些都是單純學習框架或是工具的同學比較缺乏的一部分。當然這部分課程也是跟得很辛苦( 第二次卡關 ><) ,不過幸好都有複習週,能夠慢慢的將進度跟上一些。

第四次複習週(week16~week18)

最後這部分課程終於有些與工作上學會的技能開始重複了,也讓我開始有一些信心。而這部分最推薦第 17 週的課程,精準地點出幾項常聽到,但總是搞不清楚的名詞一次說給我們懂,包括 scope、hoisting、closure、prototype、this 等,這邊也很感謝很多同學的筆記,都讓我理解的更多更清楚 ; 另外也很推薦可以把重點或是易混淆的專有名詞或概念,寫成自己的筆記或是 GitHub Pages, 除了能夠常常複習,也能當成履歷加分的其中一項。

課程回顧心得與檢討

可以這麼說,沒有這堂程式導師計畫,也就沒有現在勇敢跨出一步的我。

很感謝這些課程,很符合也很適合喜歡做好充足準備再轉職的朋友們,因為課程內容廣度很夠,且作業中的挑戰題也能夠鑽研的很深,我想之後也會再從頭複習一次,把之前沒搞清楚的觀念再加深印象,再聽一次原來的課程可能也會有不同程度的理解,且課程最後的框架部分並沒有學完,因為工作中使用的是 vue ,所以也就偷懶沒有把 React 學完。

這項課程像是一趟旅程的開始,有 mentor 帶著我們走,身旁也有同學互相砥礪,我覺得何其幸運可以跟上這趟旅程,不過我知道剛入門的我們才正要開始,之後期望延續這種進步的感覺,繼續往 senior 前進。

而在自我檢討的部分,很認同 Huli 一開始所說的,這是一堂沒那麼適合初學者的課程,從一開始充滿鬥志的報名計畫,輕鬆用走的跟完前四分之一的課程,到了中間變成跪著,後期跟課再加上工作已經快要變成用爬的完課 ( 雖然最後框架和 final project 仍然沒有做完 ),但是仍然死撐的不想被淘汰,且告訴自己一定要轉職成功。這部分真的深刻體會到堅持做一件事情真的是很不容易,而自己對於課程的努力跟練習的扎實程度還是很不夠,花了很多時間在跟心魔打架,其實應該多利用這些時間多練一些題目,說不定這些心魔的問題就不攻自破了。

另外因為課程中途就跑去找工作,變成一個沒有正規走完計畫再求職的學生 ( 很不乖乖按計畫走的人 XD) ,如果再重來一次,或是下一階段的求職計畫,我會選擇先跟完課程或是閉關完做好一些準備再求職,實力以及求職計畫都會更加順利吧。

兩段求職經驗

第一段工作經驗是從 week6 時開始,當時抱持著想邊做邊學的想法進去公司被電,不過真的很幸運的,公司的 team leader 非常樂於分享和教學,原因也是他一直有在專注 Huli 的文章,也很認同老師的想法,希望多分享多交流,大家都能夠更好更進步。這段期間在公司內部完成一項專案的前端部分,類似是醫療影像的編輯器的概念,從中學到開發的流程,以及獨立尋找專案所需的工具、library 等,且直接閱讀官方文件找資料,遠比自己猜測或亂腦補嘗試要來得精準,當然,還有應付老闆各種神奇要求和功能等 XD 。在這段工作期間,以及加上課程的學習和訓練,成長幅度確是有大幅上升( 不然可能時間都拿去耍廢了 ),連空閒時間都在練習 Codewars 的題目,果然把自己逼到極限,自己也能夠適應這樣的強度,能力也可以快速累積。

另一方面想分享的是,永遠要去想/嘗試是否有更好的解法。在第一家公司的專案中,前輩先讓我隨意發揮,因此 js 中的 function 暴增到數十項,後續要微調或是搬移都是很麻煩的事情,因此他先讓我實際遇到狀況,讓我自己體會如果使用這種寫法,會遇到哪些問題點,這麼一來才有動機去調整或轉換寫的方式,因此後續把 function 獨立出來,有需要的頁面再進行 import ,並且把函式都換成 ES6 Class 的寫法,善用繼承的方式,把程式碼變得乾淨許多,且這些函式還可以直接搬移到別的專案中運用,非常方便。

第二段則是課程接近尾聲時投遞的履歷,這邊很感謝 Huli 大大一直推我們一把,因為半年的時間如果一直處於衝刺的階段,其實也是很疲憊的 >< ,會很想鬆懈下來,但是感謝老師一直讓我們自己去想清楚,一開始初衷是什麼,現在是否還是一樣的,現在想法如何。我覺得釐清自己想要的和不想要的事情也是很重要的,如果提早知道了自己不適合,那也是一種收穫,如果剛好很喜歡這領域而且也想繼續,那就繼續吧~

第二次求職,有明顯感到比較有自信,在討論期望薪資的部分最有感 XD,而且也很開心在這幾場的面試中,也拿到幾個 offer ,最後提早找到想要的公司,因此就提早報到之後開始工作。

最後呢 ?

寫這篇心得時,也回憶了一遍這半年來的感受,有理性的收穫,也有感性的心得,也有點驚訝其實半年的時間其實過得飛快。

最大的收穫,我想是執行一件事情 / 計畫的行動力,以及獲得一項有移動力的技能,擁有這些能力,可以繼續點擊更多技能,可以開啟更多旅程。期待後續的旅程,以及會得到的收穫,或許有招一日也能夠慢慢當個分享者,把 mentor 的精神傳遞下去。

學生心得:RZ

原文:《程式導師實驗計畫第三期》課後心得

《程式導師實驗計畫第三期》課後心得

請詳閱公開說明書

先來個簡單的自我介紹。

學歷與工作經歷

高職的統測,因為狗屎運猜了一整頁的專業科目還答對,進而分發上了國立科大,機械系學士畢業。大學的班排名普普,不上不下。

畢業後到現在這三年期間,都在做機械領域相關的工作,有半導體的,有機台設備商的,所學到和所用到的技能都是機械相關的。

程式經歷

大學期間學過 C++、Matlab、Python,除了 Python,其它都是系的必修課程,但是當時學習的心態都只是應付考試能及格則已。

Python 是我自學的,上線上課程,在 Coursera、ShareCourse、Udemy 等平台。

曾經想過轉職成為資料數據分析師,也考過統計類的國考,但這門檻很高,評估過後覺得短時間內無法轉職成功,就沒再繼續走這條下去。

個人特質

喜歡嘗鮮,也很容易放棄一件事,只要那件事開始變得無趣與乏味就不會再去碰它。

很愛鑽牛角尖,很愛觀察細節與研究細節,所以一件事情我可以從早做到晚,只要它符合第一段所說的相反條件-「有趣」。不過這種特質讓我沒辦法同時一次做好幾項重要的事,否則都會做不好。

擅長慣性思考與循序漸進的脈絡思考,跳 Tone 的思考與好幾層邏輯的事情會讓我的腦袋嚴重打結,除非慢慢一步一步去研究。

可能有點孤僻(?

在這門課的優勢

碰過變數、迴圈、函式、判別式這些基本的程式語言概念,雖然沒學過 JavaScript 和 PHP,可是對前述那些程式的專有名詞與基本用法不陌生。

雖然不是資工或資處等等與程式有關的科系,不過工程背景的思維模式與解決問題的方法大同小異。

因為離職,可以全心專注在這門課程上,而有較充裕與自由的時間去計劃與調配學習進度

優勢的另一面-劣勢

對於規劃事情的架構沒有一套固有的邏輯去搭建,缺乏組織性。

學過別的程式語言,會覺得以前的我學得一蹋糊塗與不夠紮實,那麼再學其它的程式語言有可能會有相同的結局,因此自信心是負的。

過往有好多次學新的事物一下子就放棄,因此這也是導致自信心是負的其中一項原因。

之前的工作沒存到什麼錢,沒本錢讓我拖太久不工作,勢必得課程跟完後趕快找工作,因此賭注也很大,要是沒弄好而轉職失敗可能會面臨當前人生中最低潮的時刻。

轉捩點

從小到大都很愛玩電腦,玩線上遊戲,在人生當中其實有好幾次這樣的念頭閃過:「以後想寫程式,想跟那些工程師一樣,感覺很厲害,很酷很炫」,但人生好幾次的決定卻都不是與這方面有關的。

在機械領域的年資將近兩年,做過三份工作都是不同職位但和本科系有關的,也是本科系大多數人會走的三個大方向的職位。不管短期或是長期的工作體驗,這些工作實際上都沒有掀起我想要往前邁進的野心。

在做最後一份工作時,時常一邊做一邊思考:「我會想要在這行業一直做下去嗎?未來 10 年、20 年這樣子就好了嗎?安分守己地在這個不是很討厭也不是很喜歡的領域就好了嗎?」答案是否定的,一項事物對我沒有吸引力的話,我無法持續精進,我會沒有慾望想要在這方面更加努力,而這樣的工作心態對我來說,我不過就只是個空殼的身軀行走在毫無知覺的道路上。

於是我在 2019 年年初的時候,嘗試往很久以前就有想過的程式領域前進。首先我在某個線上學習平台重拾 Python 的懷抱,報名實體課程。後來看到 ALPHA Camp 的課程,加上耳聞網頁前端這條路相對於非本科轉職會稍微友善一些,因此開始在 ALPHA Camp 學習網頁全端相關的技術。一邊工作一邊學習,學了一個月後發現網頁的技術很有趣,學得也很有成就感,一方面也是網頁做出來的成果馬上看得見(「你的努力,我看得見」)。那時候認為說只要不斷努力再繼續學下去也許真的有辦法轉職,只是因為我同時在工作,再加上當時 ALPHA Camp 的課程對我來說學得很趕,導致我的自信心不是很穩定,覺得基本功不夠紮實,偶然看到 Huli 的這項實驗計畫,所以我又報名了這項計畫,打算重頭再學習並複習一遍之前 ALPHA Camp 的所學,也因為這項計畫和我想要轉職的目標很符合(而且不用先付學費),所以我最後辭職,全心專注在這門課。

拜門學藝

課程前五週的回顧。

初期的楚漢相爭

在課程的前一個月,我同時上 ALPHA Camp 那邊的課程,主要是在比較兩門課程的差異。經過一番在心中的評比後,這個計畫勝出了,主要原因是我認為這邊的計畫教學內容與方式是值得上下去的,也很適合我,應該說,我比較喜歡看影片學習,文謅謅的文章對我來說比較沒有溫度,有語音的教學模式會讓我更加印象深刻,老師所點出的重點與注意事項也會因語氣的轉換而有所記憶點。

萬丈高樓平地起

課程是從 Command Line 的教學開始,和 ALPHA Camp 有所不同。以前對命令提示字元的印象是很厲害的人在使用的,電腦專家使用命令提示字元快速地打了一堆指令,電腦就已經執行了很多道手續。

現在回頭過來看,這個教學排在第一週是絕佳的一件事,在第一週就讓我們開始接觸陌生的指令,陌生的 GitHub,讓我們接下來的 24 週都去碰它,直到現在背不出 cdgit commitgit statusgit branch 之類的指令還真的有點難。

切入 JavaScript

這個計畫是先從 JavaScript 開始學習而非 HTML、CSS,在這之前我在 ALPHA Camp 已經有學過一些 JavaScript,所以在學習課程的 JS101 內容的時候我的負擔沒有那麼大,JS101 後面的綜合題目練習畫龍點睛,學習完指令之後馬上接著練習題,測試自己是否真的學會了,還是只是假裝學會,前面幾題的題目不難,但是 Lv2 的題目就開始需要思考,這時就是融會貫通各種指令的時候。我必須說當時有幾題我想了非常久,那時有那麼點沮喪,這個現象在之前學 Python 或是其它程式語言的時候也有產生,也是之前學程式語言過不了門檻的一關,都是敗在認為自己想不到解法、腦袋不靈光而放棄學習。不過這次不同,我想到之前其他人給的寶貴建議,可以嘗試先把想跑的程式碼的最終結果先一行一行寫下來你想要怎麼執行它,這樣做之後,比較麻煩的題目最後都有做出來,屢試不爽。

前面的五週中,JavaScript 的學習就佔了兩週,我覺得恰到好處,以我的學習的狀況,其實我在那兩週沒有完全把 JavaScript 的內建函式或一些基本概念都記熟,但我為什麼又會認為恰到好處的原因在於,假如再多了一週,課程進度就會變得很拖,而且就算再多了一週,可能還是會有些東西沒辦法記熟,而且那些基本概念與語法在後面都有機會用到,另外一方面是常用的基本上也很難不記起來,比較少在用的等有用到再回頭去查或複習也無妨。另外 JS102 教的 Jest 有點到一些,在當週作業有實作,而在後面的課程都有類似的教學模式,點出一些前端會用到的技術(但就算沒有採用這些技術也做得出網頁),老師就是稍微點到沒有詳細深入去教學,這也和這門課程的核心價值之一「栽培自主的學習能力」有關。

網路基礎

在第四週學習網路相關的基礎知識,這一週的課程學習與寫程式碼無直接相關,但是卻是做網頁的人員必備知道的基礎觀念,像是 HTTP 協定、HTTP Method、TCP/IP 網路四層、API 的串接等等。這一週像是在扎根,網路底層原理的扎根,縱使今天不知道這些原理,其實也做得出一個網頁,但是會知其然而不知其所以然,硬湊出一個網頁,但會不曉得底層內部是怎麼運作的,因此如果打算要做其它的變化會沒辦法下手。

第四週老師對於網路背後的機制使用「傳紙條」的比喻方式極度到位,以另外一個角度切入並使用淺顯易懂的方式帶我們了解網路世界的概念。後來老師分別發布「傳紙條」和 API 機制的相關文章,也都是解釋地很白話的文章,也得以再次複習一遍這些底層機制。老師這樣淺顯易懂的教學模式也是讓我決定跟隨這項計畫到結束的一個重要因素。

初期小總結

課程前五週的難易度對我來說是整個課程相對輕鬆的一段,之前有學過的地方再複習一次;沒有學過的地方的內容也不會到很大量導致無法吸收,課程採取一個由淺入深的概念,但是這個「淺」又至關重要,不去熟悉它是很難繼續往課程後面走下去的。也還好課程是這樣的安排,我才能夠在初期的時候,同時上 ALPHA Camp 那邊的課程來做比較。

課程第一次的複習週內容,Lidemy HTTP Challenge 的小遊戲可以回顧自己是否已經了解 HTTP 相關的機制,那時候有幾題有卡關,也是頭一次在課程當中尋找解決方式,我想,自己解決問題也是這個課程的迷人之處,那個成就感和憑著老師的教學做出來的成品是完全不一樣的感受,有一種自己其實也不差的喜悅感,這份喜悅感一直支撐著我走到課程的後面。另外,還有 Lidemy OJ 的挑戰題,也是和 JS101 一樣需要動腦的解題,當時也是花了很久很久的時間才把 5 題給解出來,在課程一開始就意識到自己這部分的邏輯解題能力相當薄弱,不過我認為這是可以訓練的,只要繼續努力下去。

有一週某個同學說要在 Slack 建立一個 Q&A 群組,大家可以在 Q&A 群組裡面出題目讓其他同學回答,當時我是被同學選中的其中一員,這個群組在初期幫助我滿多的,不管是藉由同學的題目審視自己是否已經熟悉前五週的課程內容,還是嘗試以一個出題者的角度出題給同學同時也是自己問自己那些題目是否已經都深刻明白,加上有些題目當你沒有以出題者的角度想過的時候,會發現自己其實還沒熟悉那部分的內容,就是所謂的學習盲點。

踏入迷宮

前端與後端的學習與實作。

前端實作

HTML 與 CSS 的交織

HTML 和 CSS 之前在 ALPHA Camp 有學過一些,但是忘掉的也不少,這也是我選擇此計畫的原因之一,就是想再複習一遍。

這部份的教學我喜歡的地方是在教 CSS 的 displayposition 屬性,講得很明白,不像 MDN 上面所寫的這麼抽象難懂。其它部分的教學就是中規中矩,重點部分與常用的語法都有提到,不過光靠課程的教學內容我認為是不太夠的,還有很多 HTML 和 CSS 的細節需要自己去摸索與研讀,在後面做其它的作業的時候非常有感這一點。

前端的應用

JavaScript 在前端的三大任務:介面、事件、資料,在第七週的時候除了前面這三項,還有學習同源政策和 CORS,是個學習量非常龐大的一週。之前在 ALPHA Camp 學到事件監聽的時候,覺得這個東西很難很難,因為某個節點放監聽產生的結果可能會在別的地方,跳來跳去的,我自己很不習慣這樣跳來跳去的互相對應,所以那時候在 ALPHA Camp 學習有一點信心受挫,但,也好險有在那邊學了第一次,因為在這堂課我再次接觸到事件監聽時,比較沒這麼怕了,或許是已經接觸過一次了,或者說是老師的教學也很好理解的緣故,讓我對事件監聽不再這麼不熟悉。另外有發現到老師對於 DOM 節點的選取語法沒有完全放進課程影片當中,我想這樣的用意也在於訓練我們自己去學習其它的用法。值得一提的是,事件的捕獲與冒泡機制在看過老師的這篇文章和課程內容之後其實就可以差不多能理解它的機制了。

第七週最難的地方不是在學習,而是作業,作業難的地方不是操作網頁介面、使用事件監聽或者是傳遞資料這些,難的地方在於要寫的邏輯,第一份作業是寫一個測試反應能力的遊戲,我當時沒有事前規劃每個步驟的優先順序,導致說每做一步就卡關一次,測出來的結果都和預期的不同,再加上需要用到一些課堂沒有教到的語法,比如 window.location.reload()removeEventListenerclearTimeout,這些是後來我自己查到有這些語法才得以做完這份作業。我以為第一份作業就很難了,結果第二份作業需要做的事情更複雜,表單的每個欄位的驗證,這個欄位要加什麼樣的事件監聽,還有執行順序也要考量到,我當時做了一件很蠢的事,我土法煉鋼寫了 200 多行很多重複的 code,明明曉得可以寫得更簡潔,可是卻不知從何下手,當時寫這題其實滿無力的,雖然作業的成果就和題目所規定的一樣,但深知自己所寫的 code 是不及格的。第三份作業是寫一個計算機,作業最基本要求是寫個加法和減法的運算,不需要連加,感想是沒有寫過還真不知道做出整台計算機的功能非常有點難度...我當時只完成最基本的要求而已,程式碼寫得也不夠好,某些 block 的功能擴展彈性不夠,只要我再多個乘法或除法的運算就會多好多行的 code,維護性非常差。做完這週的作業其實有一點點小小的失落,但我自己知道我目前的能力就是這個樣子,於是選擇先接受它,相信自己之後回來修改可以改得更好的,套一句之前在 ALPHA Camp 那邊的助教給予初學者寫程式的真諦:

「先求有,再求好」

API 串燒

第四週的時候有使用 node.js 的內建 module 去串 Twitch 的 API;第八週的時候則是藉由瀏覽器作為媒介,我們寫相關的 JavaScript 的語法去串 API,我自己認為如果老師沒有在教學上加以著墨這兩者的差異,我很有可能在初期的時候對於這兩者串 API 的差別還有所模糊。

第八週的 API 內容由於是經過瀏覽器來發送與接收 API 的相關資訊,因此有其限制在,像是同源政策的處理。這週的作業我記得前兩份內容不多,很單純地讓我們熟悉 XML 的寫法,但我作業所做的時間還是有點長,主要的原因在對於 HTML 與 CSS 的不熟悉,因此有大半時間都在搞 HMTL 與 CSS,而第三份作業和第四週的作業一樣是串接 Twitch 的 API,不同的點在於串接的資料與 API 的路徑是不同的,加上這次是使用瀏覽器來實作,我遇上了同源政策的影響,所以最後使用 JSONP 的方式去拿取 API 回傳的資料並加以處理。

在第八週的時候,相當於兩個月的時間,有感於這是個分水嶺的一週,學到這邊的時候開始有點疲乏嗎?或者是說一段時間緊繃的狀態想要休息吧,所以有怠惰的情形產生,加上第八週的進度我在第七週有先偷跑,變成說我這週沒有花很多時間在這個計畫上,如果往好的方向思考,確實不是說在這項計畫長期地凝聚會神來學習就是好的,偶爾也需要讓自己稍微緩緩,只是這個緩緩,可能會有一直緩緩的風險,而這個風險的情況在後面的幾週,其實都持續浮現著。記得老師在這週也有發現到很多人都有這個現象產生,所以在每週的隨意聊有提到這是個正常的現象,只是要我們好好想想當初報名這項計畫的目的是什麼,放棄也沒有對與錯,只是你目前覺得適合自己的選擇。

後端實作

整個後端的內容藉由實作會員機制的留言板貫穿整個學習的主軸。

前言

一開始其實沒有想過初學的時候要去碰後端的東西,因為認為前端的東西就需要花費龐大的時間來學習。不過經過這門課程的學習還有了解一些網頁技術的歷史脈絡後,了解到即使你只需要使用前端相關的技術,如果想要更精進自己,或者是換另外一個角度去思考,去架構前端的程式碼,了解後端的東西對自己會有很大的幫助。

PHP

之前從來沒學過 PHP,在學習之前認為又是一頭猛獸會難以駕馭,不過實際上在老師的課程學習下,注意到 PHP 跟 JavaScript 有許多類似的地方,頂多只是某些語法上小小的迥異,也因此在入門 PHP 並且開始做留言板作業時,一開始沒有遇到太多的困難,只是很常忘記在行尾加上「;」的符號。不過困難或者是麻煩地點在後面的實作作業與 Side Project 產生了,我發現自己對於 PHP 許多基本的機制不是很了解,或者有一些要去使用的基本語法並不熟悉,也就是說,專案一大起來,變得很難很難維護,如果要做一些花招,也不是很好下手。

MySQL

在我學習 Python 的時候,就有耳聞資料庫相關的技術名詞,當時認為要處理這方面的技術是件不容易上手的事,因此心裡對它其實有畏懼幾分。

不過在這門課程第九週開始碰觸時,發現它就只是很單純的一項技術,把資料庫想成是房間的抽屜,抽屜裡的東西可以藉由自己要採用的固定方式去增減與修改,資料庫也是相同的道理,只不過不是藉由自己本人去拿資料庫的東西,而是使用程式語言去拿資料庫的東西。
老師在這邊的教學內容一直很強調 CRUD,後端對於資料庫的使用都是環繞著 CRUD 的概念。我才發現資料庫這部分並沒有想像中的那麼難以理解,當然還有很多更進階的資料庫使用方法,但課程的內容都融會貫通後實際上可以做很多網頁的後端了。

留言板的建構

在留言板作業的建構當中,老師採用一種方式,不是馬上教我們唾手可得的技術和最新的技術,或者說是最方便的技術,這也是他開設這項計畫的目的之一,不只把我們教會使用各項的技術,而是帶領我們從所有技術的底層開始了解,開始實作。
實際上,從第九週開始首先採用 cookie 實現會員登入的機制,在到第十週以前,讓我們先反思使用 cookie 做會員機制會產生什麼致命的問題。第十一週的內容就是為了改進 cookie 不適合放敏感資料的缺點,並且再替會員資料的密碼經過更安全的雜湊機制轉換。再來的第十二週又跟我們說我們寫的 PHP 程式碼有很大的安全漏洞,因此又加上了 SQL Injection 和 XSS 的防範機制。實際上在第十一週所做的改進機制(仿造 Session機制)在 PHP 的內建函式當中就有了,就有現成可以使用了,因此第十三週的內容就是改成 PHP 內建的 Session 函式。

回頭過來看從第九週到第十三週的留言板演變,每一週都有一個主題在,這些主題帶領我們了解為什麼會有後來的技術演變,它們被前人做出來的理由是什麼,這樣的教學模式對於初學者的我們,尤其是那些沒有程式基礎的大家,可以了解這個網頁前後端技術歷史的脈絡,不單單只是純粹看到現今大家很夯都在使用的技術而已,而這背後的目的都在跟我們傳遞一個很重要的資訊:

不是只要會使用這項技術,還要知道為什麼要使用這項技術

Todo-List API

在第十九週的時候有個作業是要製作一個 API,可以供給別人串接的 API,一開始我想說應該和留言板的做法差不多,後來踩了數不清的坑才意識到兩者的差異性。記得那時候我研究了一整天,不斷踩坑與爬坑,反覆查各方的資料,也有參考同學的程式碼,當時心裡一方面覺得說自己怎會搞這麼久,但另一方面又有一種愉悅感吧,因為每踩一個坑我只要有做筆記或紀錄,下次就知道怎麼處理這個坑了,換句話說就是從這個作業當中學到非常非常多的技術與觀念。

部署

從 ALPHA Camp 學到這邊來,之前就很好奇在本地端 demo 的網頁要怎麼讓所有可以上網的使用者去連到我們所做的網頁。

在課程的第十四週就是在學習這項技術。回顧思考,假如今天單靠我自己去找資料如何部署,我可能會花非常多的時間,但這一期我們有第二期學長姊的參考資料,當時我單靠僅兩篇學長姊的部署文章,按照每個步驟做下去,我的網頁就成功對外了,當下的心情難以言喻,看到自己做的網頁有辦法分享給其他人了,不過現在靜下來思考,這對我來說會是一件好事嗎?因為我發現假如今天我要去改動部署的某些小設定的話,可能需要再一段摸索期,因為沒有踩過坑,不會曉得困難之處。

後端小總結

從第九週開始,我的進度就開始落後,當週該做的進度我實際上都在做上週還未完成的進度與作業,一開始有那麼點沮喪,明明我有很多時間,比起其他邊工作邊學習的同學們,我有更充足的時間可以利用,只是從第八週開始的怠惰症,一直延續到這時候,當下該學習的時間總認為待會或者是後面的時間還可以看沒有關係,所以總是在拖延著,直到無法直視落後的慘況。

不過往另外一個角度來看,我在課程進度當中,算是在同學之間的前段班,還有很多同學的進度落後不少,這樣想的話讓自己比較不會那麼地孤單與無助,或許這樣的落後才是正常的。只是心裡還是有一種聲音就是明明知道自己再多一點努力就能跟上腳步卻沒有那麼做,或者看到一些跟上進度的同學也做得到自己卻做不到,會有那麼一點不平衡。

前端進階

方便的工具技術與 JavaScript 底層相關的原理。

工具與技術

CSS 預處理器的部份我是學 SASS/SCSS 這套,當時想說這套比較好懂也是課程示範中用的,我記得課程的教學僅一些基本的用法,我想這也是老師的目的,要我們自己去更深入地學習。當時的作業我是拿第七週的作業的 CSS 檔案來改成 SASS/SCSS,不過我當時第七週的作業沒有寫很多的 CSS,因此變成說這週的 CSS 預處理器的練習量對我來說不太夠,再加上我在作業中所使用的 SASS/SCSS 語法也都是很基本的。所以實際上我對於 SASS/SCSS 還是不夠熟悉,在後面的週數的作業要嘛不需要寫 code,要嘛就是拿以前的作業再優化或更改,最後四週的框架學習我也沒有使用和 Webpack 相關的 CSS 預處理器插件,因此沒有再針對 CSS 預處理的部分做複習或加強,這點我覺得自己挺可惜的。

在一開始學習 Gulp 和 Webpack 時不是很能理解兩者的差異,因為有許多套件與插件兩個工具都是可以使用的,變成說一開始無法理解到底我要優先使用 Gulp 還是 Webpack,不過到最後我都是以 「Webpack 是用來解決 JavaScript 在前端無法模組化的問題」這樣的觀念來釐清兩者的差異。然而後面的課程其實使用 Webpack 的場合和 Gulp 相比是多很多的,尤其是最後的前端框架 React 都有它出場的時機,這也造就我現在 Webpack 會比 Gulp 來得熟悉許多。

CSS Sprites 和 Data URI 這兩個圖形優化的技術我記得課程是沒有實作的,是要我們自己去找相關的資料來看,當時看來看去這兩者學習的必要性比起其它技術與工具,是偏低的,或者說要使用到的話,Data URI 會比較需要用到,不過在第二十週的時候有個小練習是優化網站,那時我有用 Data URI 來減少圖片的容量大小,可是卻造成一個反效果是我的 HTML 檔案變得很大,因為編碼後的字串太長了,所以我是以不好的印象來結束學習 Data URI 的...我覺得倒不如直接解壓縮圖片會來得方便,但也是有可能我使用錯誤也不一定。

底層原理

這一個部份是我對課程編排很有感的一個部份,主要原因在於這些底層機制是 JavaScript 的一些核心概念,如果說在一開始第二週時就教這些底層機制,我認為可能會有許多同學會無法理解在講什麼碗糕,或者信心受挫,心裡就會想說:「哇塞,這項計畫很硬喔...要這樣跟半年嗎?」。

前面有提到在第四週的時候有一個 Q&A 群組,當時有很多同學出了不少跟 JavaScript 底層機制有關的題目,那時很懷疑我跟其他同學是上同一堂課嗎?為什麼大家都知道這些怎麼解或怎麼出題XDD 後來才得知有些人偷跑第十七週的進度這樣。

第十七週的課程內容很關鍵,關鍵的點在於今天如果要把 JavaScript 的語法觀念弄熟,勢必得學習第十七週的課程內容,今天你要讓自己的 JavaScript 技術更進一步,這會是個起始點。當時除了原型的觀念我覺得比較抽象之外,其它的內容看了老師的課程內容還有之前老師所寫的文章之後,其實就能理解 8.7 成了,也是在這段時間發現到一件很神奇事情是,有些技術與觀念一開始看過一遍不是很懂、做過一遍仍然不懂的情況下,隔一小段時間(1 個月內)再看過一遍會發現以前不懂的地方竟然都看得懂了。

架構相關

在課程一開始上前端的時候老師有給我們看跟著小明一起搞懂技術名詞:MVC、SPA 與 SSR這篇文章,文章裡面有好多一開始都不懂的名詞,也不知道實際要實作的話要怎麼做出 MVC、SPA 那些架構出來。直到課程的後半段,我才理解老師為什麼要給我們在一開始看那篇文章,目的是要讓我們先認識那些名詞,對那些名詞有印象,接著再接觸第二遍就會有一種似曾相似、覺得熟悉的那種感覺,我記得某種記憶方法是採用這種概念,多看幾遍想要記憶的東西,然後每一遍的時間都有不一樣的間隔,越後面間隔越長。

第十八週的主題雖然是 Gulp、Webpack 和 CSS 優化小技巧,但當週有一份作業是改寫之前做的 Todo list 的程式碼,用一種有別以選取個別節點的方式去更新網頁的畫面的方式,這種方式就是先把所有資料的值都存在一個變數中,每當有資料被更動就重新渲染網頁的畫面(不管有多少資料被更新),而這樣的概念可以省去選取節點的複雜性,還可以確保網頁當前畫面與資料的一致性。

以前在用 Gmail 或是一些看起來沒有換頁的網站的時候都沒有意會到「沒有換頁」是個網頁呈現的其中一個方式,不過隱隱約約有覺得這樣沒有換頁的網站操作起來比較順暢與自在(?)。而在第十九週的第二份作業要改寫之前的 Todo-List 作業,變成 SPA 的架構,SPA 的特性就和前面所說的有關,然而這個概念在課程前面有碰過所以已經不是很陌生,整個 SPA 的實作方式仰賴於 AJAX 的技術。所以第十九週的SPA 作業比起第一份作業要做後端的 API 容易許多。不過有意識到用原生 JavaScript 或是 jQuery 來實作 SPA 是件麻煩的事情,加上效能上如果還要再優化需要做更多的動作。

加強複習

第十九週可以說是總複習大雜燴,後端、前端甚至是網路基礎都在這週的內容與作業當中,第十九週在做後端 API 作業的時候喚醒我對後端所有的記憶,長達一個月時間沒有碰後端的東西幾乎一半的內容都忘記了。再加上第四週網路基礎的複習也在這週,我覺得這個課程安排點很剛好,因為接下去就是框架的部份了,框架就是個課程學習的重大分水嶺之一吧,所以在這之前來個網路基礎複習恰到好處,雖然第十九週附的兩個 CS75 的影片我找不到中文的,讀起來有點障礙,但看英文字幕的關鍵字其實就知道影片的那個段落是在講什麼,就算真不懂,我自己再去找資料或是翻翻以前做的筆記。

不確定,而懷疑

課程學習的終章:「框架」。

前端框架

課程最後的四週有前端與後端框架,我只選擇前端框架學習,主要原因也是我之後想先走前端這條路,雖然後端也是有一點興趣,不過礙於自身能力與所學的內容我並不覺得自己的後端有比前端還厲害。只是說一開始我有想過前端框架學完之後,再來學後端框架,不過後來發現我的能力沒辦法在四週內把前後端框架都給學完,也因此,最後我只學了 React 和 Redux 這兩個前端的 library。

記得學習 React 的第一個禮拜的內容時,我花了兩個禮拜才學完,遠超乎我的預期,主要原因是 React 的筆記我做很多份,光筆記所花的時間我算過比看課程所花的時間還久。在一開始學 React 其實都有看懂語法要怎麼寫、怎麼使用,把作業做出來的難度對我來說沒有到非常地高(和其它週我覺得更難的週),可是還是花不少時間,五子棋的作業就花了點時間在想判定輸贏的邏輯怎麼寫,不過我認為五子棋這個作業出得很好,可以確實讓我們學到 React 各種基本用法,同時又不會覺得這是個很死板的作業,因為是在做一份小遊戲。接著的下一週是學 react-router,也是知道怎麼寫、怎麼使用,但是問題來了,前兩週的 React 學習我發現到我一直不是很能理解一些 React 的機制為什麼要這麼做,我只知道怎麼寫怎麼用,所以其實內心有一點不踏實,換另外一種方式來說,假如今天要我變化寫法,我可能就會打結了,我可能就會卡關,不過我記得老師還是誰有提到說一開始學框架都會有這個問題很正常,但不要灰心繼續學繼續寫,有一天你就會突然恍然大悟所有的脈絡,因為學習一個框架等於是在學習新的寫法與概念,而在二十四週學習完 React 和 Redux 之後,並且我再做一份小練習我也發現到了,發現到自己對於 React 有那麼點開竅,不再像剛開始接觸 React 時那麼地陌生。

Redux 則是最後兩週的學習重點,讓使用 React 的時候可以如虎添翼。老實說第一次看課程影片時,我對 Redux 的觀念是超級模糊的,我唯一知道的是,要使用整套 Redux 的機制得分很多檔案,一開始也不是很能理解整個 Redux 的流程的一些細節是怎麼運作的,只記得套個 high order component 好像就可以和 React 結合了,但像是 store 的背後機制還是 reducer 之類和 Redux 有關的項目感覺就似懂非懂,我也知道流程就是那樣跑,可是竟然可以這樣跑,當時覺得非常神奇。最後一週則是 Redux 的 middleware,把 Redux 的應用再做得更進階,也因為這個「更進階」,讓初學者的我在第一時間理解不能,dispatch 加來加去的,不過後來有意識到 middleware 在使用 Redux 時的必要性。

總結來說,最後四週的 React 和 Redux 是在懵懵懂懂中學起來的;卻也在某一時刻,打通對它們的基本理解,不過框架仍有許多需要學習的地方,就留給未來勤奮的自己了。

累積的技術與信心

這二十四週我按部就班照著進度走,照著老師給的進度走,時而鬆懈,時而戰戰兢兢,因此從來沒有超前過進度,但卻在後半段的學習不斷 delay 進度。我也很喜歡照著別人給的時程表走未知的路,也許是會比較心安,也許可能是自己比較沒有想法,而且是自己沒走過的路,照著別人的經驗是比較保險的方式。然而,也許是過於保險或者是自己的心態問題,我覺得雖然我每週作業都有交出來,也有針對老師給的建議去做修正,不過心裡還是不夠踏實,總認為作業這樣的難度有做出來就可以了嗎?我知道每週還有進階挑戰題,只是我沒有時間去做它們,所以這樣的情況有點尷尬,我想要更踏實再多學一點,可是時間不允許,因為還有下週接著的進度等著我去學習,因此變成說每週的不安感與不踏實感一直累積著,累積到最後一週,那個感受多麼強烈。再加上會去看其他同學的作業,我發現我與前段班的同學有一段差距,不管是前端切版還是程式碼的優化,都有很大的進步空間,我想,看同學的作業本是一把雙面刃,就在觀看者怎麼想了。

不過,老師彷彿是住在我們肚子裡的蛔蟲,知道我們在想什麼,也知道我們信心不足,他常常說他不會講些心靈雞湯之類的話,他很誠實地告訴我們沒有信心不是很意外,更怕我們太自滿,時常要我們回想為何想要報名這項計畫,也不是說一定要一直硬撐著,放棄這門課程,也只不過是在選擇另外一條人生的道路罷了。我不知道老師講這些話之後心裡是怎麼覺得的,但我覺得比起心靈雞湯那種直接激勵人心的話,咀嚼一番、細細品嘗他的話,到最後,會曉得他講的話都是很發人深省、確確實實的。

猶豫的 Final Project 與面試準備

在最後幾週的時候,我一直在想說我到底要先做 Final Project 做完再投履歷還是一邊投履歷一邊做 Final Project,畢竟兩者不衝突。到最後我沒有做 Final Project,原因在於我把做 Final Project 的時間拿去趕我落後的框架進度了,變成說我是同一時間在趕進度與投履歷,最後也很順其自然地趕完進度後也收到了不少面試邀請,於是就接著一連串地面試下去。

在投履歷之前,我的信心度還是不足的,總認為自己尚未準備好,尚未準備好獨立作品,尚未準備好面試題目、尚未準備好面試的應對,但學長姐告訴我們,老師告訴我們,並不會有準備好的一天,也沒人能夠告訴你什麼樣才叫準備好,只有你有沒有打算開始向前跨一步。並且我的理智告訴我,以前的我總是怕東怕西,擔心自己對某方面的能力不夠格,而回饋的結果總告訴我,每次的我都是想太多了,想太多是往前邁進的一道枷鎖。

上岸了,回頭來看

Offer Get

回頭看,我在每次的面試當中不斷累積經驗值,對於不恰當的應對與不足的技術能力加以檢討,補足自己的缺失,並且應用在下一次的面試上。在一個瘋狂面試的禮拜中,在當週的禮拜五,最後面試的一間公司中拿到他們的 offer,原來自己其實是有人認可的,拿到 offer 的瞬間我鬆了一口大氣,這口大氣是累積半年的忐忑之氣,我真的做到了,有一點不真實,但更多的是喜悅的心情,因此,我帶著這份喜悅的心情,打了一篇面試心得希望能夠幫助到那些比我更沒有自信、更覺得自己技術還未到家的人,有勇氣去實踐自己的目標。

筆記的必要性

回頭看,整個課程收穫最大的一點是我養成了寫筆記的習慣,以前的我因為很懶所以很少自己親自寫筆記,但在這門課程最初時刻我就開始寫筆記,因為我知道我肯定會忘記之前學的內容,每份的筆記都是寫給未來的自己看,未來那個記憶力很差的自己看,同時能讓當下寫筆記的我對技術內容更印象深刻,九成的筆記都放在HackMD當中。

反饋與見解

個人針對課程提出的心得點。

課程優點

  1. 課程內容大多以影片呈現,強迫筆記:因為影片要再觀看一遍需要花很長時間,而且假如有什麼東西忘了,要再重看一遍會不好找到是在影片的哪個段落,因此若當下不記下來,之後所花的時間是更長的。
  2. ESLint:我記得第二期沒有強制使用 ESLint 讓程式碼有一致性,這個很好點的是能讓我們在初期知道維持程式碼一致性的重要性。
  3. 課程的凝聚力:第三週的見面會、每天的進度報告、每週的隨意聊和每次的直播,這些零零總總的課程內容在技術面可以不必要,但在精神面對我幫助許多,讓自己並不孤單,有一同作戰的同學,雖然平常很少有機會見到面,但就好像大家踏在同條船共患難一樣,大家的目標也都是一致的。
  4. 小樹屋:接續上一點,雖然平常很少見到面,但只要有去小樹屋,大家就有機會見到面,我去過幾次,很謝謝和我互動的同學,還有給予我建議的學姊,同時也要謝謝鼓起勇氣去小樹屋的自己。
  5. 複習週:每 5 週就有一週的複習週,每次的進度 delay 我都是靠著複習週來扳回進度的,複習週就好像心靈調劑一樣,吃了它不會讓你強而有力,但卻能讓你更穩定。
  6. 作業的簡答題:前端除了寫程式碼,簡答題可以藉機讓觀念不足的地方加強。
  7. 作業的進階題:雖然我沒做過任何一題,不過這樣的設置對於進度超前的人有更上一層樓的窗口。
  8. 閱讀同學的程式碼:假如想要成為更厲害的人,其中一個方法就是先模仿別人。
  9. 老師的教學口吻:淺顯易懂,理解力極差的我都能懂了。
  10. 自由度高:不強迫每週都得跟上進度,學習壓力相對來說比較沒這麼大。
  11. 前人種樹:因為有第二期的學長姐經驗與老師的教學更正,我自己認為輕鬆許多,因為可以參考學長姐們分享的經驗。同時,第三期從原本第二期的四個月的課程拉長成六個月,以結果論來說,對我來說很極限地剛剛好。

課程在意的點

  1. Spectrum:這個平台最後變成面試心得的存放處,而且對使用 Windows 作業系統的人來說,選字不是很友善,編輯文章也不是很方便,所以變得有點綁手綁腳的。
  2. Slack:想要看以前的留言串都看不到了,好像要付費。
  3. 過於自由:是優點也是缺點,對於怠惰的人來說,很容易一蹶不振。
  4. 非理工科:我是理工科,我雖然沒有前端的程式經驗,但在學校學過程式語言,自己也自學過,也學了許多理工科相關的解決問題的方式,所以我覺得對非理工科的人來說,可能六個月的時間還有那麼點吃力,也許可以像老師之前講過一個開課方式是專門開一個學怎麼寫程式的課程,讓初學者訓練「語感」。
  5. 部署的練習:某部分也是我自己的問題,因為我是照著學長姐的文章部署的,照著做就部署完了,所以感覺學得不是那麼踏實,因此在這部分著墨很少。
  6. 第六週與 HTML、CSS:第六週的作業刻板我認為沒有到很複雜,架構的部分相對單調,我不確定這樣是不是好的,因為我在 ALPHA Camp 那邊一開始接觸的更難一些,不過可能老師這邊考量的點是覺得說有些人沒接觸過 HTML 和 CSS,所以作業門檻不要這麼高。還有到現在我雖然課程學完了,可是對 CSS 的處理還不是那麼有信心,也知道老師這邊比較少著墨,所以有提供一些資源給我們看,不過矛盾的點也是在時間性的問題,課程內容本身就非常多,要自己學更多外部的資源就得斟酌看了。

下一站

如果你問我這門課程容易嗎?我這個有一點點程式基礎的人會跟你說:

非常不容易。我是在沒有工作、沒有雜事、這半年幾乎都不怎麼出門的情況下好不容易跟完課程的。

如果你問學完這門課程之後,前端的技術就不用再學了嗎?我會跟你說:

想得美,這門課程只是個敲門磚,還有很長的路要走呢。

我的未來會怎麼樣的發展呢?我會跟你說:

沒人知道,我唯一知道的事情是,接下來的學習如果都是以這半年的學習態度來面對的話,我會過得很踏實。

學生心得:ChihYang41

背景介紹

安安,我 Chih Yang 啦。

歷史系畢業,很純的純文組。

就讀中正大學歷史系,必修課寫的論文是「粟特民族的祆教葬俗」,一個連我自己都忘記在寫什麼的論文主題。歷史系訓練出來的能力是「查找文件並篩選資訊」、「了解事件的前後脈絡」、「統整文件及抽象概念後重新組織」這幾項。

個性三分鐘熱度、容易放棄,從前都在自己的舒適圈踏步,求學過程中數學一直不好,覺得文科擅長就走文科,很少踏足文科以外的領域。

一切的起因,起源於學長

為什麼會想轉職呢?

主要是因為大四快畢業前在因緣際會之下,資管系的學長教了我一咪咪 HTML,後來覺得求知慾大過於平時吸收的資訊量,就改成自己摸索,看完了六角學院的 HTML、CSS、RWD、JavaScript 課程並提交作業,在過程中覺得自己的確對寫 code 頗有興趣,產生了一絲絲「或許我可以試著成為前端工程師」的想法。

沒有想太多,只有純粹學習的樂趣和好奇心就踏入這個世界,但在學習不久後就被抓去當兵了。

學習前的歷程,遺忘與迷惘

當完兵後幾乎把之前學的東西忘光光,花了幾個禮拜重拾記憶,開始思考「到底要學到什麼程度才能去應徵前端工程師?」,我總覺得自己只是在看線上課程自 high,是個閉門造車的傢伙,超級迷惘自己的方向。

那時覺得迷惘時就來點外在刺激吧,報名好想工作室的 Web Camp 是我踏出舒適圈的第一步,但不幸被刷掉了,那時我的心理狀態還沒有準備好,不太確定自己想不想要投入學習,而好想工作室就是篤定要找方向非常明確的人,另外在對問題的執著度或許也沒達到他們要求,被篩選掉也是理所當然。

被刷掉不完全是壞事,反而這股不甘心激發我的動力,經歷挫敗後才發現自己是有熱忱的,加上之前就有在關注第二期的消息,看到第三期開放報名後就欣喜若狂的寄信了。

為什麼選擇 Huli 的課程?

第一次關注到 Huli 是 零基礎的小明要如何成為前端工程師? 這篇文,那時候對我是蠻大的震撼,沒想過自己能夠看得懂工程師寫的文章,之前我看工程師寫的文章都覺得像外星語,沒想過有人能寫出地球語,Huli 的思維與特質也很吸引我,於是他成了我第一個關注的工程師。

再特別關注 Huli 已經是第二期結束的時候了,想說幹這課程心得也太 Real 了吧,Huli 檢討自己課程的時候是直接把轉職成功和不成功的人數攤開,非常的硬派,沒有過多的渲染,只有客觀的分析。

看完第二期的心得後,我覺得自己和老師的相性應該會不錯,而且課程內容扎實,轉職失敗也沒損失,自己又喜歡寫廢文,進入課程應該很棒。

另外也報名前也有評估自己的需求,我有什麼需求呢?

第一,我沒有方向,需要一個藍圖以及即時幫我修正方向的導師。第二,不想閉門造車,所以想要一個小社群。MTR03 都是符合這些需求的,毫不猶豫就動手報名。

不過每週要投入 40 小時這個前提的確是有讓我猶豫啦。

綜上所述,我有什麼條件與性格呢?

課前程度

  • 程式:自學六角學院的課程約兩個月,完成 HTML、CSS、RWD、JavaScript 課程並都有繳交作業,會依樣畫葫蘆,實際上對程式邏輯不熟。
  • 英文:多益裸考 700,閱讀文件沒什麼問題,但需要點時間。
  • 中英打:中 126/m,英 46/m。

工作經歷、背景、個人特質

  • 工作經歷:無
  • 背景:歷史系,算是毫無相關,硬要說有影響的話是比較在意技術的演進與脈絡,以及在對於抽象概念的理解與表達會比較清楚。
  • 求學過程中數理成績不佳,是考試時的軟肋。
  • 三分鐘熱度,需要不斷有新東西的刺激才有力氣向前。
  • 單純、衝動,偏好做中學,先行動後思考。

學習條件

  • 完整的六個月全職學習時間
  • Macbook pro 13 吋
  • 住家附近很棒的咖啡廳

對於課程的期待

開始前當然是先研究課綱:

1. 基本 Git 操作
2. 基本 command line 操作
3. 前端基礎(HTML, CSS, JavaScript)
4. 前端各種工具運用及原理(jQuery, SCSS, Gulp, Webpack)
5. 前端進階(React, Redux)
6. 後端基礎(PHP, Node.js, MySQL)
7. 後端進階(CodeIgniter, Express)
8. 基本網路安全(XSS, SQL Injection, CSRF, 密碼不能存明碼)
9. 部署(買 domain, 設定 DNS, 租 Digital Ocean 主機, 自己架環境)

除了 3 以外,其他我都完全不懂,連名詞都沒聽過,所以當然是期待結業時可以對上面的技術有一定的掌握度或有基礎認識。

另外看了 Huli 對課程的說明,在內在層面他注重的是「自學」、「技術的脈絡演進」,特別是使用每個技術時思考「為什麼?」的這點,先前我在自己摸索前端技術的時候完全沒想過這問題,我不知道為什麼要用,只知道可以這樣用,對於一個歷史系的人來說不懂事物的脈絡算是很不可思議的事情,所以我也期待在課程中學習每個新技術時,自我檢測能夠有條有理的說出「為什麼要用」

課程開始前,豪緊張

看到錄取當下是在半夜,興奮地跳起來睡不著,等到心情冷卻後就開始害怕擔心跟不上了,基於這種膽小的心態,我在寄出報名信後就先註冊 Lidemy 看 Week1、2 的 CS101 部分內容,然後先預習 為你自己學 Git,怕的就是稍微落後進度自己就會心態炸裂。

Huli 很暖的地方是發了一篇 學程式的第零課:心態調整,開始前我是已經調整好心態了,不過這篇對於過去學習有挫折的人是很有幫助的。

進行課程前制定的原則

前面說過我是個三分鐘熱度的人,還會拖延,我也深知這點,所以我認為自己應該要像庫拉皮卡的念能力那樣,對自己有一些制約,違背制約就會死翹翹,主要是想藉由幾點原則來養成持續學習的習慣。

每天都要寫心得

這原則規定我不論假日/平日,或進度如何都要回報今天的學習內容,架構就是按照 ORID 架構來寫,這樣做有幾個好處,第一,是我在撰寫的過程中,可以讓自己慢慢進入學習的狀態,告訴大腦「現在是專注的時間」。第二,每天都可以檢討自身學習狀況,掌控進度,這半年的學習會是一個人的戰鬥,如果沒有每天檢討進度,很容易就忘記自己走到哪裡,失去學習目標和動力。

進度不能拖延

MTR03 有個表定進度,但還是按照個人學習進度做調配,沒有強制規定要跟上。但我認為按照自己廢廢的個性,落後了就很可能放棄或是拖延症發作,所以規定自己都要準時交作業,這原則類似於第二期 Tian 大大的做法。

幸運的是雖然偶爾會有卡關的狀況,可是都有前兩期的課程直播引導方向,所以仍然可以在每週的最後一刻交出作業。

作業提交後要放鬆

說這是制約,比較像我的懶惰性格出來放風,每次提交作業的當晚都會放過自己,不管任何課程的東西,單純就爽爽耍廢。

享受

成效如何?

覺得成效不錯,畢竟撐過六個月的課程了。

制定這些原則,要瞭解你自己是怎麼樣子的人,才能讓你的課程進行順利,比如我知道自己三分鐘熱度、容易放棄,那就必須在課程剛開始最有動力的時候讓自己每天在某個地點開始寫 code,這樣走到後面有點累的時候,也能保持繼續寫 code 習慣。總之就是努力找個符合個人性格的方式,讓自己有辦法在這場學習馬拉松持續跑下去。

所以課程進行 200 天,我就寫 200 天心得,總計約 20 萬字;作業最遲會在當週禮拜天晚上交出去。

每天寫心得變成像儀式般,是我寫程式的開場;進度不能拖延則是讓我習慣評估工時、分配時間。這過程我覺得自己不是只在寫程式,也在學習如何學習,了解自己的習慣和性格來訂定計畫。

計畫 Start!

在第三期開始後新增了「複習週」的設定,也就是每五週會有個類似馬拉松休息站的地方,讓你在學習的過程中稍微喘口氣,接下來我也會以五週為單位做分段,每五週都會附上複習週的心得,因為時間距離較近的關係,複習週心得會比較貼近當時的心境。

下文中所提到「教學太快」、「資訊太多」的基準,都是以「我這位零基礎學生在當週用 40 小時學習」當作判斷。

課程前期(Week1 ~ Week5)

Week1 | Git、Command Line | 我是坂本龍馬,你是版本控制

Git、Command line 放在 Week1 超級棒,因為課程作業的提交是依照 Github flow,讓初學者從小養成版本控制的概念,並且熟悉 Command line 的操作。

Week2、Week3 | JavaScript 基礎

JS101 有部分資訊因為知識的詛咒而太唐突的進入課程,「想講的東西很多,但時間太少。」對於零基礎學生來說,還在習慣「程式碼一行一行地跑」的概念時,就突然要他提升好幾倍的運算速度,不一定能習慣這樣的速度。

但對於有程式基礎的學生來說會很適合,特別是 immutable 的概念講解的很詳細且易懂,超喜歡。廣度和深度兼具,不會蜻蜓點水的跟你介紹各種變數、迴圈就開始實作,而是一步一步講解後,配合簡單的程式解題,讓你慢慢建立計算思維。

Week4 | jest、npm、網路基礎

這是我在前期最鬼混的一週,看完影片跟著做,隨意翻翻文件就結束了,連筆記都沒做。

我會認為 jest 放在這時有點太早,學生不太知道單元測試實際能達成什麼樣的效果,此時因為接觸到的問題很小,可能是一兩個 function 來解出一道初學者的題目,那時候都用 console.log 來看 output 是什麼就可以快速看結果,跑 test 還要自己寫輸入輸出,然後等待它測試,再看個結果,以當時的觀點來說就是 console.log 就可以辦到跟 Jest 一樣的事情,就不願意多花時間去琢磨,一直到現在我對測試都不太熟悉。

但其他方面非常棒,網路基礎概念、API 是什麼、如何用 node.js 送 request 給 api 都在這週有簡單的介紹與實作,幫助日後串接 API 鋪梗,對日後接 API 的理解超級有幫助。

Week5 | 複習週、Lidemy 解謎

Week5 複習週心得

實體聚會 | 跪拜 Tian、Amelie 前輩

人生第一次參加這種性質的聚會,兩位分享的學長姐是截然不同的人,但共通點是各有自己獨特的學習方法,以及在轉職上這件事的堅持。

印象特別深的地方是 Amelie 說過她理想的公司不能像在養老、樂於學習新技術,還有 code review 必須嚴格。Amelie 講話時發光的眼神,還有做一件事的決心觸動到我了,讓我在計畫初期就開始思考「我想進怎麼樣的公司?」以及「我想成為怎麼樣的工程師?」

課程前中期(Week10 ~ Week15)

Week6 | HTML、CSS

Week6 開始學習 HTML、CSS 練習切版,這週可以改進的地方是作業要求可以更高點,在 RWD 也可以著墨更多,Huli 的想法應該是日後的作業都能練習切版,所以這週都先當作暖身,但日後的作業其實更注重功能的實踐和程式碼結構,版面就比較依賴個人美感和自我要求,因此學生的切版功力會相對弱勢。

Week7 | DOM

Week7 則是開始把 HTML、CSS、JavaScript 做結合,出發點很棒,算是將前幾週所學全兜在一起,教學步調稍嫌快速,有點難以在一週內將前幾週解 JavaScript 題目的思維一下子轉換成作業要求的邏輯,並且這也牽涉到一些規劃,或許這邊可以教學生關於「拆分功能」、「規劃結構」的概念,會讓實作更加順暢。

Week8 | AJAX

Week8 則延續 Week4 的概念,開始試著接 Twitch API,並且 render 到畫面上,有了先前的知識,花比較多時間在了解 callback 是什麼、為何要用 callback,難度剛好。

Week9 | PHP

那一天,人們想起了被留言板支配的恐懼。

留言板總共四個禮拜,不過 Week9 的課程量很多,要學習沒碰過的 PHP、SQL,還有物件導向,課綱一打開就是滿滿的內容,跟前幾週相比不是同個層級的,也是從這週開始培養出篩選資訊或先大量瀏覽文章的習慣,在此之後的每週我都會先評估這週的學習重點是哪些,如果是教學重點以外的技術、名詞,就會先放在技術債區。

Week9 因為課程量太多,課綱也只提供資源,沒有推薦的學習順序,所以我整理出了自己的學習路徑並放在複習心得中,Huli 看到後也很迅速的把課綱內容作調整,並且把之後每週的導讀內容都調整更為詳細。

這週 BE201 的產品規劃教學有幫助到我之後寫 final project 的過程,雖然內容頗為簡易,但至少有這個意識,使我之後實作 final project 能有先做規劃的概念。

Week10 | 複習週趴兔

Week10 複習週心得

經歷前面的洗禮,漸漸熟悉課程的速度,腳步站得更穩了。這階段覺得和 Huli 熟悉起來了,提交作業和等待 code review 不像之前那樣戰戰競競,反而有些期待會有怎樣的回饋、該怎麼修正方向。

學生

課程中期(Week11 ~ Week 15)

相較於前十週我偶爾都還可以聽到一些曾經有印象的詞彙,Week11 開始所有東西都沒聽過了,也就是完全脫離了舒適圈,進入未知的領域。

Week11 | Hash、Cookie、Session

講到 Hash 就想到 Hush,想到 Hush 就想聽天文特徵

大家在 Cookie、Session 的分辨沒什麼問題,都知道各自的作用。比較會出問題的應該是 Session 機制的實作,當初在這邊我看到 PHP 內建的 $_SESSION 後也矇了一陣子,後來才發現老師的目的是「用資料庫實踐 Session 機制」。如果在作業的說明加上相關的說明,應該可以解決這個誤會。

還有作業寫得非常卡,主要是因為資料結構規劃不好,改留言板的過程中牽一髮動全身,然後又不敢亂動資料庫內容,說真的超痛苦,狠下心把全部東西改掉之後才寫起來比較順。

Week12 | XSS、SQL injection、CSRF

這週我學習的方式不太對,應該要先試著駭入自己的留言板,再去做資安相關的防護,但我是先看課程、查文件後,就直接著手進行修改,修改完後再做測試,也就是我沒有直接經歷「留言板被入侵」的過程,造成的壞處就是我對這段課程的記憶淺淺的,沒有自己駭過一遍就沒痛過,以及使用的範例都只是跳出 alert 而已,因此沒什麼危機意識。

Week13 | Bootstrap、jQuery

這週延伸之前的留言板,把刪除跟新增用 AJAX 來做,第一次接觸整個前後端的溝通,也開始用到 Bootstrap 和 jQuery 兩個 Library,把留言板套上 Bootstrap 後我的感想是:

漂亮

身為很懶得切版同時美感也頗糟糕的人,這真的是福音。

我認為先寫原生 JavaScript,這週再開始用 jQuery、Bootstrap 是很適當的安排,課程中會安排幾週看「零基礎的小明要如何成為前端工程師?」,這段時間的學習就能夠體會到整個課程其實就是在走小明走過的路,親身體會技術演進的歷史進程。

Week14 | AWS、Domain、Deploy | 我是誰?我在幹嘛?

進入到這週時我馬上露出 O_O 的傻眼臉,AWS?ACID?什麼東西?超級多陌生的名詞,買網域、買 VM 這些事也完全沒概念。

因為有第二期學長姐詳細的文章 部署 AWS EC2 遠端主機 + Ubuntu LAMP 環境 + phpmyadmin 來指引如何部署,整個過程非常快速就可以解決。但 Week14 應該要先自己查找文件然後到處摸索,不然走馬看花的把這週解決後,什麼都不記得,只知道自己照樣照做就成功了。

Week15 | 複習週趴三

Week15 複習週心得

Week15 是課程的一半了,如果要半途而廢,現在是最好的時機。

這週 Huli 的隨意聊說到一件事情:

第一件事情是讓我心灰意冷(?)的時刻
就是改作業看到有同學交了很爛的 code 上來
有幾次居然就是看到有點小生氣,想說寫這什麼爛 code
但我當然也不會直接留言說你寫一堆垃圾,因為我不覺得那是件正確的事
在感性上我的確是有點生氣的,但這種被感性牽著走的時候冷靜一下才是正解

冷靜完就會想說:他寫爛 code 是誰的錯?
是他的錯嗎?還是我的錯?看到爛 code 真的有必要生氣嗎?誰沒有寫過爛 code?
背後就有很多核心的問題可以去思考
然後看到爛 code 的當下就會想說改作業好累,不想再開下一期了XDD
不過冷靜過後就好很多了,可以比較去理性地思考一些問題
我不認為去責怪學生寫爛 code 是件對的事,因為他很有可能根本沒意識到這件事
如果老師只會責怪學生,那到底要這個老師做什麼?
之前我提過同理很重要,大家一定都經歷過學校老師把私人情緒帶上課堂
若是以前我們就知道這樣是不對的,那怎麼可以自己長大之後也變成這樣?

所以我認為比較正確的做法可以是:

  1. 讓他知道他寫的是爛 code
  2. 讓他知道可以怎樣優化
  3. 讓他知道寫爛 code 是人之常情,不用太灰心

這樣好像才是真正有解決到問題

我很感謝整個課程強調「同理」這個很有人味的詞,教學從來就不是給多少 input 就得到預期的 output,「同理」的理念能讓我感受到 Huli 是和學生站在一起,他扮演的不只會是將資訊傳遞出去的角色,而是雜揉理性跟感性後,輔助學生將思維轉換,同時兼顧到你心理狀態與能力的教學者。

在這週開始我也有所轉變,開始更積極的看同學 code、當同學有問題時試著解答、互動,如果在這個課程我只扮演學習者,那我就是一個單方面接受的人,但如果可以有所輸出、互動,試著當教學者的角色,看到的視野會更不一樣。

課程中後期(Week16 ~ Week 20)

Week16 | CSS 預處理器、Stack、Queue

Week16 我印象不深,因為 CSS 預處理器先前有稍微碰過,對切版又興致缺缺,所以重點的工具就看看文件、練習語法快速的解決。

Stack 跟 Queue 這週過後其實不太知道在做什麼的,只知道在 Event Loop 有用到這樣的資料結構,但如果能夠講解更多實際的例子,讓學生明白應用到的地方會更好。

Week17 | this、Scope、Closure

這是我最喜歡的一週,原因是 JavaScript 都是我曾經想了解,但我搞不懂,或是恐懼去搞懂的。

我曾經想搞懂原型鍊,但我看不懂在說什麼,只看到 __proto__Prototype ,但根本不知道原理,只覺得更模糊了。

也曾經想搞懂 this 在幹嘛,但大部分的技術文章就是硬記,看過就忘記了,又或者是根本不知道為什麼會這樣,只看到各種情境下放上示範程式碼,然後直接跟你說指向誰。

聽過 hoisting,但只知道這個現象,不知道背後原理。

聽過 Closure,聽起來很高大上,不敢亂碰。

這週就是把我曾經沒搞懂的東西,或不懂背後原理的現象整個理解個遍,很爽!Huli 在 Week17 下足了功夫,每個章節都有搭配他淺顯易懂的文章搭配講解,讓我能在面試時秀一波,棒棒。

Week18 | Gulp、Webpack

這週首要任務是在思考為什麼要用,以及兩個的差別在哪,因為剛開始接觸會發現兩個工具可以做到的事情有重疊。

這週的重點就是看文件稍微搞懂怎麼做,在 week20 網站優化的過程中就把大部分的任務交給 gulp 了,不過踏入 React 的世界後就沒有碰到 gulp,都是 webpack。

Week19 | 前後端的最後加點

即將踏入框架的前一週,踏入這週就像踏到大魔王城堡的門口前面。

這週要寫 todo list 的前後端,很有趣的是 todo list 會和以往的寫法不同,必須是「資料有變動,畫面就要重新 render」的寫法,也就是為了之後 React 的觀念鋪路。在這邊我花了蠻多時間在思考新的思維,特別是很多內建函式不太熟,比如 filter 等等,有這週的鋪路,讓之後接觸框架的學習曲線沒那麼陡峭。

Week20 | 最後的複習週

week20 複習週心得

lazy hackthon 優化 - ChihYang41

week20 最有趣的地方是新的支線任務 - lazy hackthon 的優化!要負責優化一個載入速度慢到靠北的網頁。算是我第一次接觸到網頁優化的領域,了解網頁如何渲染的過程、什麼是 render-blocking、lazy-loading 等等。

優化的過程使用新學到的新工具 gulp 來處理,因為我超級懶惰,所以成果也不是太好,基本上只有壓縮圖片、轉換成 webp、minify 檔案而已。

很感傷這是最後一次的複習週,每次複習週都嘩啦嘩啦的打了超級多字紀錄自己的學習歷程,書寫的一大用處是可以梳理情緒,每次寫完都有不斷往前的實感,就覺得天啊我居然有辦法一步一步的走到現在。

課程後期(Week21 ~ Week 24)

Week21、22 | React、React Router

剛開始學習 React 超級困難,要把以往操作 DOM 的觀念轉換成 state 對應 UI,但這還不打緊,還算能應付,困難的是專有名詞和新東西不斷注入,還有新的寫法,比如什麼是 state、props、life cycle、父子 Component 的溝通以及模組化的開發方式,跟之前完全是不同世界,特別是模組化的開發方式,直到寫了一段時間才逐漸習慣。

React Router 則是沒什麼障礙就能掌握,作業的要求就是帶領你慢慢理解 React Router 用法,修改完之後原本亂糟糟的邏輯變得很清楚,一度覺得自己掌握 React 了,但依照 MTR03 的慣例,當你開始舒服時,就要做好下一週不舒服的準備。

Week23、24 | Redux、Middleware

Week23 是我開始嘗試新學習方法的一週。

過往我的學習方式是大量閱讀資料,看著看著腦內就會有脈絡出來,知道大概怎麼做。但 Redux 我開始嘗試新方法,先動手實作再慢慢梳理脈絡。

原因沒有別的,因為看資料還是不懂,索性直接實作,這時才發現 Redux 是個實作大於理論的技術,光是透過教學影片看 Huli 在不同檔案之間轉換是很難理解的,必須要自己寫 container、dispatch、action creator、reducer ,才能慢慢懂運作流程。

middlware 在理解 Redux 概念後就能簡單的套用,把 call API 的 code 抽出去後檔案結構的確變得清楚多了。

Week24 之後呢?

在 Week24 之後我沈寂了一段時間,每日心得沒說什麼話,和以往差蠻多的。

撞死

Huli 在 Week28 的隨意聊說到:

有些學生覺得課程結束之後失去了方向,因為沒有每週進度了,不知道接下來要學什麼,覺得茫然,覺得無助。

你自由了,但自由的代價是你要有更強大的自我管理能力。
之前六個月都依賴著課綱,知道下一步要幹嘛,知道最後自己會變成什麼樣子,但這不是一件可以一直持續的事。結業之後,你得靠自己了,不會再有人幫你規劃要學什麼,也不會有人告訴你說哪些知識是重要的。

課程之後我的確有頓時失去依靠的感覺,因為我是超級依賴每週進度的人,Week24 後的進度表突然跑完了,就很茫然。

特別是開始寫第一次的 final project 然後再砍掉,整整一個禮拜白白浪費掉,又要重新開始規劃新的 project,真的是有點懷疑自己在衝三小。覺得自己好像沒做事,每日心得就有點懶得寫,所以 Week24 ~ 面試前是沒什麼在記錄的,就是流水帳般的敷衍書寫,算是個低潮。

最後經過三個多禮拜的掙扎生出了一個不上不下的作品,自己沒有很滿意,還有很多改進的空間,但改的時候又有點沒力氣動手,因為改 code 又是個工程,需要點衝勁,衝勁卻剛好用完了。

對自己也沒什麼自信,當初期待是不斷掌握新技術的同時,可以認同自己的基礎,逐漸建立自信,但我發現不是這樣,反而是越到後期發現自己懂的很少很少,掌握得只是皮毛的程度,想說我這樣很糟糕吧?學了這半年就這樣嗎?還有好多東西不懂欸?

Huli 此時也說了另一段話:

在第一期的時候其實計畫名稱有個 prefix,叫做「從零到一」。六個月的課程你們學到很多,但沒學到的也很多,這很正常,我不可能把所有東西都放進課程裡面。而且就像我說過的,當你懂得愈多,不懂得也會愈多,你不該把這個視為一種缺陷,因為這是成長。

前面有說到我對計劃的期許是基礎變穩,並且建立自信;但隨著課程進行到後期,反而開始變得越來越沒自信,覺得懂的東西非常少,到了 Week24 結束甚至覺得自己什麼都不太會。

因此要找工作時挺沒自信的,畢竟履歷打開就空空的,作品不太完整,了解的技術也只是皮毛,有一度都想要逃避下去,躲在課程中了,但想逃歸想逃,我其實也不知道能逃去哪,逃多久,所以還是該面對。

真正開始面試反而沒那麼可怕,因為不太像是想像中的考試,而是互動、交流、聊聊天,到後面就是抱著去社交與見世面的心態,是個需要熟悉的過程,面試時我還是有很多的問題答不出來、回答的很鳥,但隨著面試次數的上升,對於這些突發狀況的調整進步許多。

在結束課程後這段時間,要幫自己建立的心態是 「不懂的很多,但這很正常。」

學習時我有個不太實際的心態,就是期待自己結業後能夠什麼都掌握,一切準備周全後才能有自信的離開課程,彷彿武俠小說裡修煉神功大成的武林高手,內力大增後,大喝一聲,打破大門出去武林大殺四方。

但似乎沒有「準備好了」這件事,直到我拿到 offer 要去工作前,都還是覺得自己尚未站穩。所以我重新回過頭看課程名字,「程式導師實驗計畫」,這也是個尚未準備周全的課程不是嗎?但依舊出來招生了,並隨著學生的回饋不斷調整與進化,演變成現在看到的樣貌,面試也是同理,這是個需要藉由回饋再調整自我的過程。

MTR03 裡,我是個怎麼樣的學生?

很愛找麻煩的學生

學習課程的時候我會思考「為什麼這樣教?」、「這樣教好在哪 or 有什麼問題?」、「如果是我會怎麼安排?」,如果覺得有更好的方式,就會在提交作業的 pull request 提出,或是在複習週寫落落長的心得給 Huli 建議。

在學習卡關時難免會懷疑自我,比如「我是不是白癡為什麼學不會??」必須承認我也常會有這種挫敗的心情,但更多時候是先思考「現在學不會,那我能怎麼學?還是課程哪裡能改進?怎麼學能更好?」,不停的修正自己學習方式。

MTR03 是個很有生命力的課程,每一期最後都會和當初預定的進行方式不同,這和寫 code 一樣,必須不停修正方向,不一定能一步到位,永遠能有更好的教法,而 Huli 心態也非常彈性,在評估可行性之後就會馬上執行,所以學生和課程都是不停在轉變的。

很愛串門子的學生

MTR 的作業提交是透過 Github flow 來進行,code review 確認沒問題之後,就會 Merge。

Huli 在前期的喊話有提到,這課程不只是看課程、交作業而已,看別人寫的程式碼也是非常重要的,所以鼓勵同學們互相去看對方的作業,了解怎麼樣是好的程式碼。

基於這次的鼓勵,以及自己默默學習真的很寂寞,我開始會到處看別人的作業,心情特別愉悅的時候會留下 comment,主要希望透過自己這項行為讓整個課程的同學互動性增加,讓 code review 的風氣更加興盛。

這邊很有感的地方是每次為了 code review 我會不斷地去搜尋資料,把觀念了解得一清二楚才敢給同學建議,可以檢驗自己的學習成果以外也和同學交流。然後觀摩厲害同學的作業也著實能提供我不同角度的思維。

MTR03 優缺點

優點

社群 hen 棒

我喜歡這種小班制以及有進度的課綱,很像回到學校上課的樣子,很累的時候稍微跟同學聊聊、看看同學心得又會有力氣繼續向前了。

Huli hen 棒

說說我認為 Huli 在教育方面哪邊做得很好:

  1. 尊敬、同理受教者

取自我對「被討厭的勇氣二部曲」的理解

教育者角色只是協助學生自立,不會參與或強迫施加自己的看法在別人身上(不然就違反了課題分離的概念)。要抱有同理心去思考學生做某件事情的目的為何、了解學生的目的是什麼。

  1. 教育是交友不是工作

Huli 的出發點是興趣使然才開始教學,就像一拳超人的琦玉那樣,所以無欲則剛。

如果只是因為完成某件事情、可以賺錢,這樣的教育叫做「工作」,然而因為這不會帶給你歸屬感,所以不會感到開心。Huli 的教育比較像是交友,老師與學生是平起平坐的關係,不是上對下的,「交友」關係是開心的。

簡單來說他是個 open-minded,個性隨和、很有人性但是有所堅持的老師。非常對我的調調,態度就是:「寫程式很好,不寫也沒有不好。」所以參加課程蠻放鬆的,沒什麼壓力。

他花費許多心力在做的事情是「把教學調整到大部分人都能懂」以及樂於分享,每週的隨意聊都可以看到他最近在幹嘛,很特別的地方是他會展現「他跟我們一樣」,會跟我們說他在耍廢、拖延症發作,講一些莫名其妙或很有道理的話。

課程內容 hen 棒

這不用多講,課程內容很多,可以讓你從前後端都了解個遍,非常紮實。

可以改進的地方

知識的詛咒

在課程剛開始建立觀念時,還是有一些地方會講得太快,或忽略了部分作業的資訊,比如前面提及的 JS101。

課程完整度

這邊講的不是資訊不足,而是有時那週是一個完整的預錄課程,有時是直播,可以的話我覺得都用預錄課程會更完整。

作業

課程前期的作業有個問題是「不知道有哪些資訊被省略」,比如 Week7 有些資訊沒有提到,作業中或許需要用到,學生會面對的問題會是「我不知道自己該知道」,可能繞了半天還是找不到該怎麼做,後來會參考同學的作法,並且一邊懷疑自己「為什麼人家知道這個東西,而我不知道,是哪裡出了問題嗎?」

或許在每個作業可以有幾個 hint,提示可以往哪方面著手,讓學生自行決定是否查看。

另外還有完整度的問題,在面試時我面臨到的問題是所有作品的完整度都不夠,就連 final project 也被嫌太小了,也許能讓學生看一下所謂完整的作品大概是怎麼樣,或者是把作業的完整度改善,可以像是留言板的做法,每週作業都是連貫的,在課程結束後會有幾個較完整的作品。

協作

整個課程都是單打獨鬥,final project 雖然鼓勵協作但不強迫,可以的話能有幾週是同學一同合作寫專案或許會更好,但因為進度不同可能會很麻煩,具體要怎麼做目前沒主意。

不知道如何形容的地方

自信心

當週課程結束、寫完作業還是不知道自己會不會寫 code,但我覺得這點很難有所改進,並且不確定這是不是課程的問題,但我的心理狀態在課程結束後反而沒特別有自信,而是認為我好多東西都不懂,從第二期、第三期的學生來看,有自信的學生似乎非常非常少。

結語

和當初的期待有落差嗎?

先說第一點,「對課綱中所條列的技術有一定掌握度」。

我認為是有滿足自己的期待,已經具備基礎的知識,絕對沒有到每個技術都非常熟悉,不一定能豪不猶豫咻咻咻的就完成,但看文件亦步亦趨的使用是沒問題的,除了建立對技術的基礎認識與使用以外,我覺得更重要的是在過程中慢慢練習看文件自學的能力。

再來是第二點,「學會對每個技術問『為什麼?』」

這點無庸置疑是有符合期待的,每次學習新技術的時候,Huli 都會講解這技術為了什麼存在,又或者是在簡答題就會有檢測,比如「為什麼要用」、「不用會怎麼樣」。很巧的是在「我是如何完成一篇文章的?」看到 Huli 說他很喜歡歷史,造就他這麼注重技術演進的脈絡,和歷史系畢業的我不謀而合。

接下來呢?

「所有的故事,都是從選擇開始。」

進入 MTR03 這個選擇,我沒有猶豫太久,並且毫不後悔,超級有趣,進行的也蠻順利的,是一個棒到不能再棒的故事,像是火影忍者的中忍考試、七龍珠的天下第一武鬥大會、司法島之前的海賊王。

不過轉職的故事不會只停在結業,順利也不會一直順利下去,面試、選擇工作、正式工作又是其他篇章,老實說,我在工作這個故事章節蠻衰小的,導致目前又必須重新回到面試的過程,故事開始有點轉折、走下坡,像是忍界大戰的火影忍者,或是現在的海賊王(和之國真的不好看)。

但我還是蠻樂觀的,在前一份短暫的工作經驗也很有趣,經歷了超級特別的事件,並且更清楚自己想要進怎麼樣的公司、想要在哪方面精進,算是繞了一圈再重新彌補當初得到 Offer 後覺得可惜的地方,而我也相信自己不會止步於此 👍

學生心得: Ponchimeow

程式導師實驗計畫第三期心得

背景/經歷介紹

機械系畢業,在學期間碰過 Matlab 與 fortrn,那時對於程式印象停留在運算與韌體上居多,尚不了解網路與網頁。
以工程師加強班身份參與計畫,因參與時仍在內湖電信業擔任乙方,工作內容除釐清商業邏輯外也使用 Java 撰寫 API,後來因某些原因便離職,自此後專心於課程計畫上。

參與動機

寫這篇心得的前幾日偶然發現一份 google 試算表文件,上頭填了一行自介

凡事皆有因,有因皆有果

2017年,想想居然是兩年前,只記得當初對於每天經手一成不變的事物感到厭倦,在良率、報表與各種不理解的設計圖中打交道,偶然在網路上看下 Huli 的號招(?),就填了表單,對,只填了表單,後續自己的學習也很片段,嘗試了些線上課程或是翻翻書,沒有一個很完整的學習目標或是方式,那你問我說這個做什麼?我想這算是其中一個我能想到我為什麼現在會打這篇心得並踏入資訊業的某個紀錄點。

過去曾參加過 ruby 課程也參與過職訓局,但一直在轉職與工作上覺得自己十分不理想,一方面覺得自我能力不足,一方面也覺得不知道往哪個方向學習,直至四月看見 Huli 程式導師計畫,覺得課綱全面且完善,對於不知所措的人十分友善,時間規劃、內容、課後實作、課程反思問答都有,一步一腳印的讓你打好基礎,心一橫便參加再次投入學習之中。

當你沮喪、失落、徬徨時,請想想最開始推動你,觸動你內心最深處的想像是什麼。

喔對了,還有就是上課前只要繳保證金5k,不像是其他課程要你一次就付幾萬的,簡單說就是你有試用的時間,時間後覺得適合自己可以再有所決定,而為了督促你學習也有著你必須三不五時的在 Huli 建置的教學系統上說說什麼,對只要說說什麼就好,哪怕你只學了一點,每一點都是前進的足跡。

課程

基本上課程是以線上影片為主,每週會有導讀告訴你這週會(該)學什麼並給予課後練習,實際應用學習到的技能,也透過實作中去知道自己的了解程度邊做邊補足,老師並不會真的手把手的帶著你走每一步,而是給了你釣竿跟方位,剩下的你能抓到魚還是釣到靴子就看個人努力造化。

課綱在 大改版:程式導師實驗計畫第三期報名簡章 有簡明的圖表能直接看到,雖然有很明確的課程與時間安排,但課程內容吸收效率基本上因人而異,畢竟每個人條件皆不同,在學習安排上也有著許多差別,不要被每週的時間與內容對自己有所限制,並不是說在這時間內學好這些東西你才是合格或是怎樣,而是一種動力與推力,助長著叮嚀著你去學習。

對於課程內容沒有太多著墨,其實還有著

  • 利用 Slack、spectrum 在網路上把大家聚在一起,有問題發問,沒問題發牢騷(?)
  • 實體見面會,邀請前幾期的學長姊分享學習心境路程,也讓大家能互相實際見面交流學習狀況。
  • Huli 環球旅行時在國內外的問答直播,大家在 slido 上認真或生活化的發問,從課程、職場、旅遊趣事、天南地北都能聊(欸
  • 雖然我常稱呼 Huli 一聲老師,但其實他不太在意尊稱這事情,比起老師更像是個你學習上的...夥伴?他不會直接告訴你完整全然的答案,也不會直接否定你的想法,而是會試著去理解、分析為何,進而讓你瞭解自己為何這麼想,而後應該怎麼做比較好,一個良性的交互討論過程

你一直會知道自己不是一個人

誠如上面有說過,你需要三不五時的在教學系統上浮出並說些什麼,在上面你會看到來自不同背景的同學,在這不論是為了轉職、進修或是多瞭解些什麼,大家都有著共同目標,有著一群人在相同的路上走著,努力著。

阻礙

學習最大的阻礙是什麼?對我而言,無佗,僅動力。所以逼迫自己,即便離職也要像正常上班一樣,早上出門,晚上回去,我不是能完全認真的人,但只要人在外面就會想到自己出來就是要做些什麼、不論是課程還是額外的自我學習上。

後續

這篇寫得頗沒條理的,好久沒寫這麼多字QQ,在寫這篇心得的當下我仍在求職中,課程進度剛進入 week23,下一份工作還是個問號,處在投履歷面試或繼續努力課程的疊加態中,過去在轉職資訊業的路上跌了兩次,說不怕絕對是騙人的,但走過的總是經驗,人跌倒了總不是就趴在那一輩子是吧?認份,不認命,繼續努力。

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.