從「修改遊戲」找到寫程式的樂趣:ALPHA Camp全端網路開發第一學期課程心得(第二部分,基礎:暖身)

--

(註:ALPHA Camp網路開發課程分為四個學期,2019年9月起學期一有較大的改版,以較簡單的JavaScript課程取代原本Ruby的部分,且前二學期的編排與作業亦有其他調整,本篇討論的是舊版學期一)

第三次接觸程式後,終於報名了ALPHA Camp課程,一收到信就和我預期的不一樣,沒直接教寫程式而差點想要退款給差評(X),而是一再強調:開始學寫程式之前,有更多需要了解的東西,正式開始前至少還得先談網路概論、產品思維、介面設計,且還得先學另一個相對簡單的程式語言。

簡言之,第一階段的暖身課程,僅希望學員在後續進度大量「運動」之前要先做好「暖身」,充分了解程式設計大概在幹嘛後,才不會容易因腦袋「抽筋」或其他傷害(再度)放棄學習。

單調但重要的「蹲馬步」:先打草稿,才用HTML+CSS進行「網頁工程」

我是在2019年2~3月報名參與學期一的課程,當時也剛開始第一份的助理工作,想說只要三千元、每周額外花個十小時不算是什麼負擔,就算事後沒興趣也能當作「科普」補充新知,課程的前半段進度也算平淡通過,直到因個人原因有意外變化。

如前言提過,學期一的課程並不直接帶到寫程式,而是先用長達一周的概論仔細鋪陳(其實後面各學期也是如此),先強調寫程式的目的是做產品,而做產品要有為使用者著想的思維,從而最要先懂使用者故事(user stories)、使用者流程圖 (User Flow)、線框稿(Wireframe)等乍看與寫程式無直接關聯的事務,但能幫助釐清開發者方向的重要前置作業,而非僅當個「碼農」,「種代碼給會社磅」。

當初學到這邊時,其實想起大學時系上教授地理資訊系統(GIS)課程老師的風格差異:有的在帶入實際操作前,會先花幾周課好好說明主題的方向、大概的理論、將來的應用等,到實作的部分也會放慢步調各個說明,儘管整體教到的項目較少;也有剛開課就強調每次上課會不停的有各種實作演練,稍微起頭介紹後便要學生自己跟上進度,以在有限時間內多教一些內容。

連結到我的學習經驗,ALPHA Camp的做法比較像前一類的老師,可能考量學生以文組、非本科、第一次接觸居多,能學多少比教多少更重要,多點人文式的鋪陳更能帶多數人進入狀況;相對後者不見得是壞事,但就很看個人的「造化」。對剛起步的轉職者而言,更為友好的引導能助於他們留下來完課,隨進度循序漸進,而不是失序的被嚇跑。

接者,嚴格來說,第一學期的課直到後半才算是開始寫程式,HTML與CSS代碼寫的是程式的「表層」,就像以前用VB拉出圖形介面後,才能加上互動的功能。用雲端(線上)整合開發環境Codepen學了一二周語法定義,覺得自己開始進入「庖丁解牛」的初期進展:見網頁不是網頁。儘管尚不能妥善理解,卻已能看見代碼規律組成的架構,甚至能挖出網頁中沒出現的資訊(像是顯示錯誤的網頁中無法撥放的影片連結……)。

但在感恩讚嘆(?)學懂HTML之餘,我卻覺得CSS儘管重要卻很麻煩,容器(box)與各種排版方式未來實作時不是仍需多嘗試效果,就是得回去翻語法與定義,且調整數值常使人犯「強迫症」,往往要「喬」一段時間整體介面才能滿意(更別提後面還要考慮RWD,還好有Bootstrap可快速處理許多樣式設定,才能少寫多了容易混亂的CSS,甚至不用寫或放幾行在HTML就好)。

「盲」挖「紅寶石」出卡牌:從Ruby「驚鴻一瞥」程式編碼與運算思維

如果說前半段是在明確到強迫症的指引下,才學用HTML架鋼筋混凝土、CSS做裝潢「蓋」出第一棟固定規格的靜態網頁,學習Ruby則像是往幽微的坑洞挖礦,雖然因課程定位,只預定挖一小處就好,探索的過程卻同時發現驚奇與困惑。

另一方面,剛好在修課期中筆者遇到二次介紹原求學領域相關的工作機會,決定先花點時間投入爭取,結果「賠了時間又折羽」,沒能全程在時限內完成進度,但也是我下定決心,徹底放棄轉回原先相關領域的念頭,額外花時間靠遍覽同學作業代替助教講評,將Ruby的作業補好補滿。

繼續投入學期一後半,我發現與C++不知所云的額外代碼、VB只記得拉介面、Python強制縮排等限制有點機車相比,Ruby的語法簡潔自由,給我的第一印象相當心動:接近簡單英文(跟作者是非英語母語的日本人有關?)、較少額外符號,內建功能齊全(例如後面JavaScript寫亂數要好幾行Math與其他指令,Ruby用”rand”就搞完),再加上那時個人的打字速度還沒練起來,中英文仍須看鍵盤(求學時到底是怎麼打完各篇報告與論文的……),可以少打很多字無疑是最大福音!

學完變數運算、資料結構、流程控制以及除錯後,勉強算是會寫程式,但也只停留在寫簡單的運算,直到中後期練習了幾份「古早味」(因為還沒用到圖形介面)作業,其中有一個我覺得過度簡化規則「不夠好玩」的「二十一點(黑傑克, Black Jack)」遊戲。在試圖修改的同時,逐漸發現只靠教案中提過的功能不夠用時,才連結起我過去的經驗,正式開啟我對寫程式的樂趣!

在學寫程式之前,我其實對電子遊戲的修改相當有興趣,從小時候找金手指、作弊碼,到長大後找改檔模組、甚至嘗試自己改內容,從原版遊戲外獲得更多娛樂(這應該另外寫一篇文章談談對寫程式的啟發,自己挖坑跳?)。那時想說,既然這個遊戲的原始構造比大型遊戲簡單太多,可以肆無忌憚的改到爽吧?

於是憑著能有限運用的時間、學習資源與能力,先遍覽其他同學的作業外加那些功能,挑出喜歡的部分看懂原理後加以借(ㄆㄧㄠˊ)鑑(ㄑㄧㄝˋ),再另外加入測(ㄗㄨㄛˋ)試(ㄅㄧˋ)功能;至於其他起初想做但做不出來的功能,只好靠Google搜尋關鍵字找方法想辦法實作,想不出來就得有所取捨,結果寫出近250行的大雜燴(點連結可以玩玩看)。雖然因遲交沒有助教回饋有點虧,但觀摩與搜查資料的自學體驗:無價

有了這層體悟後,後面的作業與期末考對我來說就只是「技術問題」──卡住時多想一下,就算想不出來也可以去查,多花時間總可以搞定(雖有時得拖好幾天……)──想通後就會變簡單,就算較複雜不能完全記住步驟,至少還有回去再看懂的機會。多寫幾分作業後,也開始覺得寫程式比起單純的文章有趣多,可說是真正的「語言遊戲」,且無論寫法是否有誤,凡測試必有回饋,且克服總總錯誤(Bug)順利執行後,能帶來極大的成就感,好比打電動通關。

終於到學期末尾,與前面不先談寫程式一般,以Ruby示範寫邏輯之餘,本課程更強調要培養不限於特定語言、也見於日常生活的「運算思維( Computational Thinking)」,以四個步驟推演至(支配現代與未來世界?!的)「演算法(Algorithm)」,再加上一篇以「科技如何改變我們的經濟、工作場所及職涯」收結,期許學員未來能在各領域,用科學的方法有效率的解決問題,更凸顯這門課要教的不只是寫程式而已,也帶到未來將以同樣精神帶領學習不同的工具。

最後,前面說了很多學期一課程的特別優點與帶來的啟發,也說一下我覺得舊版課程編排有些問題的部分(新版沒這個問題):「沒上軌道的紅寶石」。由於ALPHA Camp更早的課程後端教的是Ruby on Rails(簡稱RoR或Rails),就是以Ruby寫的框架,可以猜測那時Ruby教學還肩負後端課程的預修作用;然而新近的課程開始「去Ruby化」,後端改教Node.js,以統一前後端語言,卻在前面課程還沒改完的當下,使Ruby的篇幅顯得尷尬:學期一結束後不再碰到,最前面在Codenvy(題外話,收掉了……)的快速開發體驗沒得收尾,學一門不會繼續用下去的語言感覺非常詭異。

下半段的Ruby教學因為課程後續規劃被鬼隱了……(取自:https://pixabay.com/vectors/gem-ruby-stone-jewel-treasure-297015/)

確實,學期一開啟我想學程式的興趣,卻也留下一些疑慮,使我晚了一期到六月才進入學期二,細節下期待續。

--

--

Bob Yu-Zhen Huang is developing on web

2020年代第一天起,以第一篇廢文開始網路開發的學習紀錄,短期目標是不定期分享關於寫程式,或與資訊、軟體、電腦勉強沾得上邊(?)的學習心得與感想(先定廣一點方便擴張範圍……);長期的話,則是將這個站停掉(!)──待未來自行架設部落格新站後搬過去(開發專案與習作彙整:https://github.com/BOBYZH)。