XXX 公司(團隊) 您好， 我是鄭翔駿，透過 104 人力銀行得知貴公司在徵才的資訊。經由職缺描述，認為自己的能力可以為團隊帶來價值及貢獻，因此來信應徵「前端工程師」一職。 ◆ 擁有不同面向的個人作品集，皆自行發想獨立開發（非程式作業）。 ◆ 良好溝通能力，連續三年在公司年終內部投票中獲得第 1 名。 ◆ 擅長分析拆解、找尋問題核心 ◆ 良好自學能力 綜合以上能力，我認為我是「前端工程師」一職的不二人選。附檔為我的履歷及作品集，內含三個個人專案（提供 Demo 連結）及技術文章分享，歡迎詳閱。期待能有機會與您當面討論更多關於網頁製作與前端工程師的想法。感謝您花時間閱讀這封信！

當初為什麼報名這堂課？ 報名這堂課是因為現在如果想找工作，框架幾乎是必備技能，所以在上完 JS 直播班後便繼續上 Vue 的直播班，並且希望能再完成一個 Vue 的作品。 學習過程 上完八周課程對 Vue 算是有一定的了解，了解了 SPA 跟為什麼會需要框架。 最喜歡直播班的哪些活動？ 最喜歡直播班的活動是每日任務跟每日助教，雖然我還沒使用到每日助教，但這次直播班看得出來大家的問題變多了，也能在大家的問答中學習到很多東西。 對於這次直播班，我個人覺得每日任務可以再更有挑戰性一些，但也許不太好設計或是讓大家都能跟上節奏，或許跟 JS 直播班一樣有比較有挑戰性的每周任務也很有趣

先講結論： :::info 感謝當初做參與的決定，非常值得 ::: 雖然 要想專題題目很燒腦 要想使用者故事、規劃功能

當初為什麼報名這堂課 我要成為前端工程師 第一週~第八週的學習過程 第一週 第二週 第三週 & 第四週 第五週

GitHub Repo GitHub Pages Demo 連結 首頁

Notion 老師用 Notion 統一管理大家的進度，在上面除了可以看到大家的進度，甚至還能隨時觀摩別的同學的設計稿及作品 線稿完成 線稿圖是在 7 月底也就是第四週左右完成並通過審核，在 8/1 統一被加入 Discord 的另一個專題頻道，這時候也開始幫學員媒合設計師，依照老師排的順序各自可能拿到設計稿的時間會不太相同 裡面也提到後面有一個月的時間，每周日晚上老師也特地跟夫人請假，跟大家開線上專題進度會議，由老師親自盯著大家進度並討論遇到的問題。 設計完成 我的設計稿應是在 8/14 左右拿到，再次謝謝設計師 ==Kosugi Lai==

學習使用 Whimsical 來畫 Site Map 及後面的線稿圖 也有人使用 Figma，但大多是有設計經驗或是設計師底 認真覺得有設計經驗的人在設計畫面真的漂亮很多

第三週：伸縮自如的 RWD 手機網頁排版術 第四週：多頁式網頁設計 第三、四週：眼鏡形象網站 第三、四週開始迎來初階的挑戰 SCSS 的使用、RWD 的設計、多頁式的規劃、Layout、EJS 等等 及第一次使用到任務管理工具 Gulp，使用過後覺得有這類工具真的很好用，在初期麻煩一次把需要做的任務都寫好，後面就可以快速使用節省繁複的流程

直播班課程部分 既然都參加直播課程了，就拚到底吧！ 課程都有針對不同身分或時間做規劃，找到適合自己的方式，持續地努力輸出 就算程度不同，但一定會比之前的自己更進步 只要有輸出有進步，就會有更多的動力支持你繼續走下去 另外如果可以，不要害羞，找到能一起努力的夥伴，幫助程度會比想像中的還要大 轉職者部分 同身為正在轉職過程的人，比起學習新領域新知識的興奮與焦慮，我想更多的是不安全感。 我們不曉得現在是否走在對的道路上、不曉得未來會怎麼樣、不曉得會不會成功。

Html CSS SCSS RWD jQuery Javascript Boostrap 5 Git、GitHub 借用了六角已寫好的任務管理工具 Gulp+Ejs 外部套件如 Swiper、Masonry、AOS

運用技術 進度追蹤 最終作品 目前狀態

線稿圖通過審核後，就會開始媒合設計師幫忙設計 這屆設計師主要會是幫忙設計首頁風格、決定主副色系，以及幫你做美美的 Banner 提供規範如字型、字體大小，也會提供元件跟圖片來源讓我們直接使用 非常感謝負責我的設計師 Kosugi Lai 確立了網頁的色調跟風格，主橘副黑的搭配非常有運動風！ 後續我也有根據自己的想法做微調，也先徵得設計師本人的同意

首頁的主要架構與風格是參考雷神索爾演員 Chris Hemsworth 在澳洲投資的健身房 Centr

線稿圖就是把想要的網站規劃內容、排版、文案都盡量詳細地畫出來 這時就會確立大概的排版跟內容，越詳細越好 設計師就會根據線稿圖來幫忙設計首頁、擬定色系 之後用這些線稿來作為切板的主要參考（實做時還是會隨時調整） 有完成線稿圖並且通過審核，才有機會可以獲得跟設計師配合的服務 我大約是在第三週把三、四週的眼鏡電商作業完成後才開始畫線稿圖 有些同學在更早期就已經完成，雖然時間算充裕，還是建議越早開始越好，可以更詳細地去規劃想要的內容 左邊為前台頁面，右邊主要是會員跟後台系統的頁面，綠色底是最後有切出來的頁面

前期(主要功能) 我是前台使用者，我是學生，我想知道我家附近有提供場地租借的場所可以讓自由教練上課 我是前台使用者，我是教練，我想知道有提供場地租借的場所 我是前台使用者，我是教練，我想根據條件(地點、時間、費用)篩選有提供場地租借的場所 我是前台使用者，我是教練，我想知道這個場地較詳細的資訊與介紹 我是前台使用者，我是教練，我想聯絡該場地詢問問題 我是後臺使用者，我是場地業者，我想登錄自家場地的資訊 我是後臺使用者，我是場地業者，我想回覆自由教練的問題 我是前台使用者，我是學生或教練，我想直接透過地圖找尋附近的場地

發想緣由 本身的工作是健身教練，之前在北投明德的工作室，現在則是自由教練到處跑 學生散落在各處，常需要配合學生找各地區有提供租借的場地，google搜尋多為場地自己的粉專，少數網站有提供部分資訊但實際可使用場地數更多且無地區搜尋功能，許多場地其實有提供租借但都要自己打電話問才知道。 於是希望有一個平台讓 有提供租借的場地可以登錄自己的資訊提高曝光度 讓教練跟上課的學生可以更快搜尋到希望上課的區域有哪些場地可以提供上課 並有社群平台可以

專題主題 網站地圖 Site Map 使用者故事 User Story 線稿圖 Wireframe 參考網站 作品設計

累積個人作品集 想親身了解製作專題的過程 想試試看自己的能耐 有設計師幫忙設計 多出來的福利 1. 累積個人作品集 本身是非本科系，沒有學校背景與深厚底子背書，想轉職除了個人特質與腦袋裡的東西，最重要的應該就是個人的作品集（也是以上兩點的實際呈現）。有機會有自己的作品還有人可以問，能不參加嗎？ 2. 想親身了解製作專題的過程

這是我第一次參加線上課程與直播班 我認為非常值得 :::success 感謝用心的老師、與強大的助教群 ::: 廖洧杰校長非常有耐心地分享知識與經驗，也時常爆肝討論或回覆訊息，深深讓人覺得他真的是個教育者，而且是最佛的那種 穎旻老師每週自己實作完作業後再帶大家分享作業可以怎麼做，就算自己做完了也可以瞭解已經在業界的人是怎麼寫你寫的作業

我會希望能更早養成寫部落格或筆記的習慣，事實上工作後已經較少會做很多的筆記，上次寫部落格也已經是學生時期的事，HackMD 也是這次要寫心得牆才開始學如何使用。但有許多東西在事後回想的時候其實已經有點模糊，要再次寫出來可能也已經沒有當時深刻。 程式碼也是，學習過程中如能更有系統地整理成自己的筆記，除了日後找尋能更方便、也能多一次輸出增加自己的記憶，我想這會是我這陣子其中之一個課題。