Photo created by freepik
新手工程師踏入技術圈：如何準備你的作品集
「作品集」是一個很基礎且求職必備的要件！尤其是對跨領域轉職工程師的求職者來說，履歷上作品集的重要性絕對佔前兩名，當然不是說作品集一定要開發多特別的專案，或是多讓人驚艷，而是作品能讓面試官產生興趣，甚至能針對作品對你問更多的問題！身為一位網頁開發的求職者，到底該如何打造自己的作品集呢？
一、展現所具備技術能力
在你所準備的履歷上，除了透過過往的工作經歷來展現人格特質與軟實力外，也會條列出自己熟悉使用的技能，像是：
- 熟悉 Ruby
- 熟悉 Rails
- 對 JavaScript 有經驗
- 對 TailwindCSS 有經驗
當你在履歷上列出「熟悉」、「有經驗」的字詞，要如何證明你與面試官所認定的開發能力在同一基準上呢？這時「作品集」將成為你的技術能力佐證，不管是以何種方式展現在履歷上，如：GitHub、個人網頁、APP，或是在面試時，當場以筆電展示作品，都是可被接受的方式。
在面試過程中展現你的作品，有條理地敘述專案發想、專案架構、開發時碰到的困難及如何解決、專案延伸規劃等，甚至有機會獲得面試官的青睞，進而提高談得期望待遇的機率。
二、展現你在專案開發中所具備的軟、硬實力
在技術面試中，當面試官看完你的作品，最常問的就是：「你為什麼要這樣寫？」、「你為什麼要使用這個套件，而不是用另一個呢？」，面試官們想知道的就是「WHY」。如果你的回答是：「因為課程老師是這樣教的。」這樣的回答反而會扣分，而且這場面試可能很快就結束了。
站在面試官的立場，會更希望從專案中來了解你的思考脈絡，是如何拆解問題、尋找答案。在尋找答案的過程中，是否有嘗試釐清解法背後的原理？還是只是把程式碼 copy and paste 而已。也想知道的是你是否在你的能力範圍內，衡量不同工具的利弊，選擇最合適的工具來解決問題。
- 技術能力：了解你使用技術背後的動機，是否基礎紮實且能熟悉應用
- 溝通能力：從中了解你的邏輯表達能力是否可以與團隊溝通及合作
- 解決問題能力：碰到問題卡關是如何解決，並讓專案順利進行
三、打造符合業界所需作品集
應徵不同領域的網頁開發工程師，面試官對於作品集在意的點是不相同的。舉例來說，前端作品的重點會放在前端介面、互動式網頁、使用者功能、廣告嵌入等技能；而後端作品則是看重 Web API 設計與開發、資料庫串接與設計、自動化測試等，有完整功能的網路應用程式，例如：購物車系統、會員系統等。因此，技術主管會以作品集來了解你的即戰力。
透過以下四個方式，來開始創造你的作品吧！
1、參考常見練習作品、常用網站
在規劃作品前需要思考：「我希望這個作品能展示哪些功能給觀眾？」
與其準備多個零碎、不同主題的專案作品，讓面試官摸不清你的強項，不如將焦點放在少數兩到三個專案上，並針對想展示的開發經驗，規劃合適的主題，更有助於聚焦在你的技術力上。
作品的參考方向來自各個社群網站、電商平台、社群論壇、課程平台或是影音平台等，從中挑選出一個有把握完成的網站開始你的作品。這些網站的版面都是經過精心設計的，可以直接學習它的功能與設計，來累積自己的開發經驗。如果想要開發更進階的專案，從你參考的網站中，試著思考它們還有哪些功能可以再優化、完善，並加上自己的創意，讓專案變得獨一無二。
常見的練習作品像是 Todo List、留言板、部落格、一頁式 Landing Page 等，除了做出基本功能外，也需要再發想一些相關的延伸功能，才能為自己的技能加分。
舉例來說，當你挑選一個電商網站為自己的作品，可能會有以下構想甚至更多
- 決定要不要用框架 (通常是要)、該用哪一個框架來寫 (React / Vue / Angular /etc…)
- 如果要做成 SPA (Single Page Application)，路由 (Routing) 該用什麼方式？
- 如果要串接金流，是要串本土的像是藍新 / 綠界 / LinePay 或是國外的 Stripe？
- 如果商品的照片很多，檔案要存放在別的地方嗎？(AWS？Firebase？其他？)
- 如果商品很多，是否有商品搜尋功能？如何優化搜尋的效率？
- 是否要掛上如 Google 分析這類的工具，管理並分析使用者動態？
但重要的是，你要能夠理解整個專案背後的開發邏輯與架構，當面試官針對你的專案問問題就能知道你是自己摸索開發出來的，還是貪圖方便而複製別人程式碼做出的。
2、優化課程作業
為什麼是優化，而不是說直接使用課堂上的作業當成作品集呢？
課堂上的作業，是你在學習程式過程中，開發能力在初階時所做出來的，通常作業會是老師在課堂上所教的內容，技術主管無法透過作業看出鑑別度，如果你可以根據過往在課程中學到的技能，融會貫通後，再重新開發出一個具有「一定程度複雜性的專案」，唯有改造過後的作品，才真的能展現你的技術力。
想將「作業」變成加分的「作品」要如何優化呢？以下提供幾個方向做為參考：
- 統一 Coding Style
- 優化程式效能
- 架構易讀性、維護性
- 清晰的註解描述
- 增加更多功能，使作品完善
3、技術部落格、比賽作品
技術部落格也是作品的一種，將學習到的新技術或是解決技術卡關的問題輸出成文字，不僅可以幫助你重新整理思緒，內化所學的知識，也能展現你對於學習技術的熱忱更是你記錄踏進技術圈以來的成長，從文章中也能看出你的程式思考邏輯以及你找尋解決問題的途徑。
現在有許多程式技術活動與比賽，例如：iThome 鐵人賽、黑客松等，準備比賽作品的過程中，不僅促使自己快速學習，更能深入思考程式開發邏輯。經過你腦中內化並淬煉而出的作品，不僅印象深刻，也能為你的技術能力加分。
四、如何建立好的作品
1、建立一個 README.md 檔案
在每個專案中建立一個 README 檔案，目的是為了讓使用者不用閱讀程式碼就能理解你專案的說明文件。同時也會是面試官審視你作品的入口，你應該直接將希望面試官看到的亮點列在 README。
不過，專案能否長期發展，取決於文件的完善度，README 內文的撰寫風格因人而異，會提供的內文資訊像是：開發專案的目的、功能、環境需求、簡述專案使用到的技術、優勢、注意事項等。
如果 README 的內文短缺或是書寫混亂的話，後續維護者會需要花更多時間的釐清程式碼，那麼後續的維護就會比較不長久。
2、遵循 Coding Style
Coding Style 的主要目的在於增加程式的易讀性與一致性。不僅讓程式容易維護，也能間接加快開發速度，以及避免更多的資料錯誤。
在寫 Code 的學習路上，正常人無法寫一次就完美到位，中間一定會有修修改改的過程，寫出好 Code 是需要許多開發經驗所累積出來的。在學習過程中可以找一個具有代表性的 Coding style，模仿它、學習它，先讓自己不要寫出爛 Code。當哪天需要與不同工程師合作時，你的程式碼是禁得起檢驗的，雖然 Coding style 不一樣，但不代表自己寫的比較差。
Coding Style 則是會根據每個人及工作團隊的使用習慣而有所改變，但不論是在哪種程式語言中，保持良好的 Coding Style 都是很重要的。
3、清楚的註解
寫註解是很重要的一個環節，當程式碼如果無法用命名、函式或是複雜邏輯表達訊息時，就必須撰寫清楚的註解幫助維護者或是開發者快速理解程式碼的邏輯。
但是，如果程式碼本身能清楚表達邏輯、架構清晰時，那麼就不需要再為程式碼加上註解了，多餘的註解會讓程式碼看起來更複雜，導致干擾閱讀反而是沒有幫助的。
4、持續優化作品集
隨著技術的進步，專案中所使用的套件或是框架也需要跟著更新。而且隨著開發經驗的增加，會發現專案的功能太少、太基本或是之前寫的架構不夠完善，所以必須透過優化、延伸功能，讓專案更完整，升級你的作品集。
五、將每個作品整理成作品集
1、GitHub
版本控制儼然已成為軟體工程師必備的技能。GitHub 是以 Git 為基礎且為開發者提供雲端版本控制服務的平台，不只可以把程式碼上傳到平台與他人交流，也可以在平台上找到開源專案，觀摩其他人的程式碼。
將作品上傳至 GitHub (或是其他版控服務網站) 是必備步驟，並以條列式的敘述方式列出你的技術亮點，能讓面試官快速抓到重點。即使面試官沒有細看，也能達到暗示自己具備版本控制觀念及技術，有操作 Git 的經驗，能讓面試官留下專業的印象，為自己加分。
2、部署到雲端
如果你的專案較複雜，或是有後端系統等，部署到雲端會是另一個好選擇。初學者可以用快速方便的 Heroku，不過 Heroku 現在已中止對免費專案的支援了，如果想要使用免費的雲端服務則需要再找尋替代方案。如果願意花點時間部署至企業慣用的 AWS、GCP、Azure，雖然難度高也複雜，但更可以展現你的技能。
六、結語
想增加自己的作品的話，可以考慮自學、或是挑一些覺得不錯的範例去效仿、變化，不但累積了作品，也能精進自己的能力！
不論將來你的求職方向是去各大公司工作或是走向自由接案，「作品集」都擔任非常重要的角色！透過作品可以看出你的程式邏輯思維、技術程度、專案能力等，這些比起說：「我很熟悉某項技術」、「我很有經驗」等抽象的字詞還更有說服力。好的作品集就是展現自己技能實力的最佳證明。