專職網頁前端工程師,熱愛研究網頁上各種新的技術與設計,並且實行路上觀察以使用者體驗角度思考那些形隨機能的街景與物件。
我是一個為人誠懇、做事細心負責、善團隊合作比且樂於接受挑戰。 喜歡閱讀、攝影與散步並且實行路上觀察,以使用者體驗角度,思考那些形隨機能的街景與物件。
轉職契機
於賣場擔任大宗貨物與提貨券業務工作時,為了開發新客戶,開始自學設計工具並自行設計DM,製作拜拜商品方案與抽獎禮品方案以此開拓新客戶,並且連續獲得全台分店排名前三名的成績。
於學習設計工具時,迷上網頁能與人產生互動的各種新奇功能,毅然決然放棄工作欲學習前端工程與介面設計的能力,於是我利用半年時間進修,參加資策會 Web/App前端工程師養成班 第36期的半年職業培訓,並且已經順利通過,取得認證。
工作經驗
於過往工作經驗中,讓我了解如何有效溝通與快速釐清重點,並且隨時保持開放態度接受他人意見並轉為自我優化的養分。
在網頁前端開發已有4年經驗,熟悉使用Vue.js框架與Nuxt.js框架,善於使用 SCSS + BEM 建構RWD響應式網頁。
參加過Scrum敏捷式開發,以兩週為一個Sprint週期,積極審視與討論產品、程式碼、團隊合作的問題並修正。
擁有多人合作的經驗裡,在程式碼品質管理方面,曾與同事制定Code Review原則與規範,在程式碼版本控制方面,曾使用Git flow 開發流程,並了解 Merge 衝突的處理,也曾針對 Commit Message 與 PR 制定規範。
擁有從 0 到 1 的SSR和SPA網站建構經驗與重構經驗,且實作具維護性和擴展性的元件,專注在網頁效能提升的實現。
完整重現設計師的視覺設計與與互動效果,具備多年響應式網頁建構經驗, 除了切版與降低重複使用的css整理為變數與Mixin外, 並且支援所有主流瀏覽器
熱愛優化團隊的合作方法與工作流程
例如:制定 code review 流程並動態修正流程,探討Scrum該怎麼優化並適合團隊狀況
股市爆料同學會(https://www.cmoney.tw/forum/popular/buzz)
- 帶領三人團隊開發與維護
Cmoney 最高流量的專案 股市爆料同學會
- 使用Nuxt.js框架SSR架構開發與維護論壇性質網站
- 使用WebSocket 實現即時股價與實現聊天室功能
- 實作圖文編輯器功能,讓專欄文章的作者們能更有效的快速上稿
- 優化團隊合作方法與工作流程 例如:制定 code review 流程並動態修正流程
- 規劃整體系統架構需重構的項目,並按照優先級與重要度拆分,與迭代的方式分期完成
- 使用前端技術提升網站效能(LRU Catch)
- 載入效能優化 透過 Chrome DevTools 和 Lighthouse 來檢測 web vitals 並針對不及格的指標做優化修正
- 針對server過載問題,設計API快取與頁面快取
- 完整重現設計師的視覺設計與與互動效果,且實作具維護性和擴展性的元件
- 與專案團隊合作協助分析需求和拆解需求商業邏輯並提供各種解決辦法
課程影音後台
- 使用NX建立Monorepo架構
- 使用Vue.js框架SPA架構開發影音後台
-
介面規劃是用 Scss + BEM + Tailwind css的樣式架構
- 前端測試框架使用Jest
- 跨團隊進行協作,協助分析需求和拆解需求商業邏輯並提供各種解決辦法
- 規劃整體系統架構,以迭代的方式拆分功能並規劃分期完成
-
完整重現設計師的視覺設計與與互動效果,且實作具維護性和擴展性的 UI component library
- 介面規劃是用 Scss + 部分bootstrap + BEM
規劃響應式網頁
- 使用前端技術提升網站效能及提供出色的用戶體驗
- 使用前端技術提供SEO優化方法如:語意化HTML標籤、規劃結構化資料
- 使用Nuxt.js框架按照SSR架構下建構各個元件
- 因應新聞的即時性與時效性進而開發推播功能,使用 firebase cloud messaging 來實作
-
開發會員頁面與社群平台帳戶一鍵登入功能,使用firebase auth來實作各社群平台串接,使用vuex來做資料的傳遞與登入狀態判斷
- 為了加速行動裝置的使用體驗進而開發 AMP
(Accelerated Mobile Pages) 加速行動版網站
- 追蹤使用者網站使用足跡進而於每個頁面埋下 GTM code, 進而達成可於GA觀察網站使用狀態
- CSS
class 設計模式使用 BEM
- 建構結構化資料增強網頁的 SEO
維護既有平台系統:
替舊有模組增加新的判斷與新增元件
接收客戶修改內容:
修改樣式與資料修改
開發新UI介面模板:
主要使用Vue.js框架按照既有SPA架構下開發元件與維持網頁響應式以及瀏覽器相容性
重構既有介面模組:
由於元件初期設計與規劃現今越來越難以維護,故將舊有元件重新解構與設計
使用原型鏈撰寫會員權限功能
使用JQuery 的 extend + appear + TimelineMax 製作基本動畫套件
製作模組化元件供企劃選擇與產出活動頁面(類似UI
Kits)
確保網站符合RWD響應式
專職網頁前端工程師,熱愛研究網頁上各種新的技術與設計,並且實行路上觀察以使用者體驗角度思考那些形隨機能的街景與物件。
我是一個為人誠懇、做事細心負責、善團隊合作比且樂於接受挑戰。 喜歡閱讀、攝影與散步並且實行路上觀察,以使用者體驗角度,思考那些形隨機能的街景與物件。
轉職契機
於賣場擔任大宗貨物與提貨券業務工作時,為了開發新客戶,開始自學設計工具並自行設計DM,製作拜拜商品方案與抽獎禮品方案以此開拓新客戶,並且連續獲得全台分店排名前三名的成績。
於學習設計工具時,迷上網頁能與人產生互動的各種新奇功能,毅然決然放棄工作欲學習前端工程與介面設計的能力,於是我利用半年時間進修,參加資策會 Web/App前端工程師養成班 第36期的半年職業培訓,並且已經順利通過,取得認證。
工作經驗
於過往工作經驗中,讓我了解如何有效溝通與快速釐清重點,並且隨時保持開放態度接受他人意見並轉為自我優化的養分。
在網頁前端開發已有4年經驗,熟悉使用Vue.js框架與Nuxt.js框架,善於使用 SCSS + BEM 建構RWD響應式網頁。
參加過Scrum敏捷式開發,以兩週為一個Sprint週期,積極審視與討論產品、程式碼、團隊合作的問題並修正。
擁有多人合作的經驗裡,在程式碼品質管理方面,曾與同事制定Code Review原則與規範,在程式碼版本控制方面,曾使用Git flow 開發流程,並了解 Merge 衝突的處理,也曾針對 Commit Message 與 PR 制定規範。
擁有從 0 到 1 的SSR和SPA網站建構經驗與重構經驗,且實作具維護性和擴展性的元件,專注在網頁效能提升的實現。
完整重現設計師的視覺設計與與互動效果,具備多年響應式網頁建構經驗, 除了切版與降低重複使用的css整理為變數與Mixin外, 並且支援所有主流瀏覽器
熱愛優化團隊的合作方法與工作流程
例如:制定 code review 流程並動態修正流程,探討Scrum該怎麼優化並適合團隊狀況
股市爆料同學會(https://www.cmoney.tw/forum/popular/buzz)
- 帶領三人團隊開發與維護
Cmoney 最高流量的專案 股市爆料同學會
- 使用Nuxt.js框架SSR架構開發與維護論壇性質網站
- 使用WebSocket 實現即時股價與實現聊天室功能
- 實作圖文編輯器功能,讓專欄文章的作者們能更有效的快速上稿
- 優化團隊合作方法與工作流程 例如:制定 code review 流程並動態修正流程
- 規劃整體系統架構需重構的項目,並按照優先級與重要度拆分,與迭代的方式分期完成
- 使用前端技術提升網站效能(LRU Catch)
- 載入效能優化 透過 Chrome DevTools 和 Lighthouse 來檢測 web vitals 並針對不及格的指標做優化修正
- 針對server過載問題,設計API快取與頁面快取
- 完整重現設計師的視覺設計與與互動效果,且實作具維護性和擴展性的元件
- 與專案團隊合作協助分析需求和拆解需求商業邏輯並提供各種解決辦法
課程影音後台
- 使用NX建立Monorepo架構
- 使用Vue.js框架SPA架構開發影音後台
-
介面規劃是用 Scss + BEM + Tailwind css的樣式架構
- 前端測試框架使用Jest
- 跨團隊進行協作,協助分析需求和拆解需求商業邏輯並提供各種解決辦法
- 規劃整體系統架構,以迭代的方式拆分功能並規劃分期完成
-
完整重現設計師的視覺設計與與互動效果,且實作具維護性和擴展性的 UI component library
- 介面規劃是用 Scss + 部分bootstrap + BEM
規劃響應式網頁
- 使用前端技術提升網站效能及提供出色的用戶體驗
- 使用前端技術提供SEO優化方法如:語意化HTML標籤、規劃結構化資料
- 使用Nuxt.js框架按照SSR架構下建構各個元件
- 因應新聞的即時性與時效性進而開發推播功能,使用 firebase cloud messaging 來實作
-
開發會員頁面與社群平台帳戶一鍵登入功能,使用firebase auth來實作各社群平台串接,使用vuex來做資料的傳遞與登入狀態判斷
- 為了加速行動裝置的使用體驗進而開發 AMP
(Accelerated Mobile Pages) 加速行動版網站
- 追蹤使用者網站使用足跡進而於每個頁面埋下 GTM code, 進而達成可於GA觀察網站使用狀態
- CSS
class 設計模式使用 BEM
- 建構結構化資料增強網頁的 SEO
維護既有平台系統:
替舊有模組增加新的判斷與新增元件
接收客戶修改內容:
修改樣式與資料修改
開發新UI介面模板:
主要使用Vue.js框架按照既有SPA架構下開發元件與維持網頁響應式以及瀏覽器相容性
重構既有介面模組:
由於元件初期設計與規劃現今越來越難以維護,故將舊有元件重新解構與設計
使用原型鏈撰寫會員權限功能
使用JQuery 的 extend + appear + TimelineMax 製作基本動畫套件
製作模組化元件供企劃選擇與產出活動頁面(類似UI
Kits)
確保網站符合RWD響應式