AppWorks School Batch #16 Front-End Class 學習筆記&心得(駐點階段四:個人專案~Sprint 2)


Posted by ralphhong5465 on 2022-09-15

個人專案進入第二個週期的短衝(sprint),除了使用者介面的設計與繪製外,核心功能全部都要完整,在不管頁面好不好看的情況下,已經要是一個「可以用的網站」。

取自 AppWorks School 前端班課程大綱

短衝一回顧

就如同第 10~11 週的跨班協作(Co-work),每個短衝結束都會有場「回顧會議(retrospective meeting)」,每個人根據當次的短衝提出認為自己「做得好的」與「可以更好的」項目。


短衝一「回顧會議(retrospective meeting)」討論看板

以我個人而言,在個人專案開始後,最有感的莫過於「靠自己寫出來的東西變多了」。記得以往在 STYLiSH 階段時,常常看到作業題目後就頭腦一片空白、不知如何下手,Firebase 階段也總只能跟題目大眼瞪小眼,但這次操作 Firestore 與以往完全沒碰過的 Google Map API 就順利許多,卡關時多半能靠官方文件、技術文章、技術社群討論或教學影片自己解決,不再像以前需要到處纏著同學與老師問問題,還能夠在看到報錯時自己除蟲(debug),這感覺超棒!

然而,本次並沒有使用 Git Flow 開發、進行版本控制,所有的更動都在同一個分支上,也完全沒有 push 到 GitHub,而是用複製到 GitHub Gist 的方式當備份,會這樣做主要是因為第一週時有很多都只是在玩小功能,第二個短衝開始要逐一完成專案各項功能時,就要回到正軌,以 Git Flow 開發。

個人專案-短衝二

在短衝一確認外部資料可用、確立好資料結構後,短衝二的目標是完善核心功能,除了要讓每個頁面都能達成一開始設定的目標,也透過路由(route)設定,讓使用者給予的每個操作都能得到對應的反饋,整體的使用者流程應流暢,在不考慮是否美觀的情況下,已經是一個功能完整的網站。

由於在下一個短衝就要開始設計使用者介面(user interface, UI)、進行切版,這個階段也要找到參考的素材,確立介面設計方向。雖說到目前為止都還用不太到 CSS ,但因為是以 styled-components 開發,多數人在撰寫各個元件時多半已經加上基本的排版設計。

短衝二階段目標首頁畫面

台哥大講者分享-CTO Rock

這個短衝比較特別的環節是 6 月 22 日下午的「台哥大講者分享」,講者是今年 2 月 14 日剛接任台灣大哥大資訊長的 蔡祈岩(Rock),跟第九週 Jamie AMA 活動不同的是,本次是一場有主題的「演講」,而非單純回答問題。

演講的內容有一半跟程式語言發展相關、但我對另外一半印象更為深刻:講者個人的成長經驗。

那是 1970 年代的越南,時值越南戰爭尾聲,在戰亂中,什麼承平時期看似荒唐的事情都變得稀鬆平常。在這樣的背景下,講者驚險地搬到臺灣,在連注音符號都不認得的情況下降級就學,然而,他卻能在就讀交大資工系時,寫出現在看來還是很耐玩的遊戲《決戰俄羅斯》並贏得比賽,且在後續的職涯發展中,經歷各種領域、不同角色的歷練,最終被台灣大哥大總經理 Jamie 挖角,轉到電信業擔任資訊長,詳細內容可參考《今周刊》的文章

講者於逆境中突破難關的故事固然令人動容,但讓我最享受的是:我已經好久沒有聽歷史故事啦!以往透過其他資料認識越戰時,都是看到比較中性的敘述,但講者本身有親身經歷,可以講很多一般歷史資料不會記載的個人經驗,讓整段歷史變得更有溫度,也多了很多有趣的荒唐事蹟。由於對歷史故事的著迷,我幸運於活動尾聲因正確答出西貢淪陷日期「1975 年 4 月 30 日」,拿到最後一張有獎徵答獎品-星巴克咖啡券。


因答對「西貢淪陷日期」獲得的星巴克咖啡券

有這麼多面對逆境的經驗,Rock 與我們分享一種面對事情的方法:永遠都先說「太好了!」。不管是被老闆罵、被裁員、得癌症等種種不可能有人遇到會很開心的事,先說「太好了!」,接著再想這件事情為什麼好,乍聽之下或許有些奇妙,但仔細想想,既然事情都發生了,「轉念」不正是解決問題最好的開始嗎?有了正向的心態,處理再棘手的問題都變得容易許多。或許正是因為有這樣的習慣,他才能逆來順受、妥善處理每件麻煩事,在不同產業間走跳自如,還都是擔任高階幹部!

週五主題短講:鏈結串列與雜湊表

本週短講的主題是資工領域的一大學問「資料結構」,問每一個資工本科系畢業生或具有一定資歷的工程師,一定都會強調這門課的重要性。

記得先前看到「學習資料結構、演算法在工作上真的有用嗎? 實際工作經歷不藏私! | 二元樹 | 雜湊 | 計算機概論 | 工程師 Nic」這部影片時,我便開始對這些內容產生好奇,還買了線上課程來看,並在深入思考後寫成一篇又一篇的筆記,包含本週主講的「鏈結串列(linked list)」與「雜湊表(hash table)」:

  1. 資料結構學習筆記:鏈結串列(Linked List)& 陣列(Array)
  2. 資料結構學習筆記:雜湊表(Hash Table)

由於這些內容先前有花時間研究過,要理解分享內容並不困難,但真要從無到有寫出鏈結串列與雜湊表完整的程式碼,還是依然有很多卡住的地方,只是現階段的個人專案還不會用到這些較為複雜的資料結構,就有待日後再重新複習了。

職涯對談

隨著畢業季逐漸接近,負責求職相關事務的 Tiffany 跟我們每一位學員都安排了一對一的職涯諮詢與訪談,主要依據我們目前的學習狀況、以及端午節期間填寫的「職涯調查」表單做進一步討論,表定時間只有二十分鐘,但我實際面談的時間卻長達一個小時,實在非常感謝 Tiffany 願意讓我們問好問滿,畢竟要跟全屆每一位學員都來場這樣的深度對談,真的非常耗神。


職涯對談進行地點:salesforce 會議室

心得

在制定這個短衝的目標前,導師來了場隨堂小考,看我們是否有能力在不與人討論、也不上網查的情況下,用 React 寫出一個具有簡單功能的微型專案。讓我非常感動的是,在比預期快的時間內,我就一行一行把程式碼打出來、完成了指定功能。這應該是我駐點以來寫程式寫得最順的一次,把成果拿去跟導師討論時還有些緊張,最後的結果其實也沒有所謂通過或不通過,不過因為我的寫法只是「達成需求」,還不算是最佳寫法,可以進一步優化。

不只小考順利,本次短衝制定的目標也比預期的順利許多,原本以為要花一天做的功能、居然花不到半天就寫完了,導致最後不僅完成所有當初設定的基礎功能,連設為有空再做的「進階」功能都一一實現,還要去想看還有什麼新功能可以加,最後提早開始進行使用者介面設計與切版。

進度超前是一種很奇怪的感覺,畢竟這不是因為自己能力好、而是當初設定的目標本來就不算太難。先前 STYLiSH 階段大幅落後的經驗,總讓我很擔心自己無法完成設定的目標,但提早做完又很怕自己的東西太過簡單、沒有技術亮點。在這樣心煩意亂的時刻,有位工程師朋友非常好心地幫我進行程式碼審查(review),結果立刻抓到一堆問題,很多地方問我為何這樣寫,我卻支支吾吾答不出來,慶幸有提早面臨這「類面試」的情境,我得以檢視自己對個人專案的了解程度,還要再花時間仔細了解專案內容,務必要在求職時,對當中的每個項目與延伸觀念都有百分之百的掌握。

要走完這樣如馬拉松般的培訓營具有一定負擔,中途退出的人不是沒有,但對我來說,既然都選擇踏上轉職這條路,School 也願意提供這麼好的機會,我更應該珍惜在這裡的每段時光、好好努力。由於進度超前,我在這個週末就提早完成了首頁切版,看到網頁外觀逐漸成型,成就感十足,也讓我更加期待成品!


#AppWorks School









Related Posts

[Heroku] 佈署你的 Node.js + Express + Sequelize migration 專案到 Heroku 上吧 !

[Heroku] 佈署你的 Node.js + Express + Sequelize migration 專案到 Heroku 上吧 !

Web開發學習筆記10 — 預設參數、Spread Operator、Rest Operator、解構賦值、陣列方法的練習筆記

Web開發學習筆記10 — 預設參數、Spread Operator、Rest Operator、解構賦值、陣列方法的練習筆記

F2E合作社|select下拉選單|Bootstrap 5網頁框架開發入門

F2E合作社|select下拉選單|Bootstrap 5網頁框架開發入門


Comments