Uvf4eypaj4v36vgdzfvr

Hector Chiang

Front End Developer • Taipei,TW • [email protected]

「生命是長期而持續的累積,堅信著技術也是。」

擁有三年前端開發經驗,包括 Vue、React 等前端框架。 擅長在實作中吸收新技術,也樂於學習與解決問題。對於老架構翻新有一定經驗,並喜歡鑽研技術底層的原理。每天都會閱讀技術文章來讓自己保持對技術的敏感度。 常與同事傳達「細節決定成敗」的觀念,認為不管是程式上的細節也好,畫面上的細節也好,使用者體驗上的細節也好,都會在不知不覺的情況下提升成品的價值。如同我熱愛蘋果的產品,因為它總是能在我們想不到的細節上下足功夫。

- 工作經驗 -


inwinSTACK_Nilvana™, Front End Develop, August 2020 ~ February 2022

Nilvana™ Vision Studio

公司的主力產品,與另一位同仁一起負責前端部分。使用 Vue3 + Pinia 進行開發,其中包括非常多重要功能:

 1. 圖片標註功能:使用 Canvas 技術開發圖片標註功能,並支持多人協作。 

 2. 訓練即時監測:接收後端資料並封裝圖表套件且高度客製化用以即時呈現模型訓練狀況。

 3. 共用函示封裝:由於大量業務需求所以封裝了許多共用功能,經估算節省了 20% 的開發時間。

 4. Typescript 導入:由於是大型專案並決定導入 Type 系統管理資料,不管是前後端共同約定的 Data Schema,也讓前端資料流更為清晰,更甚者是 VSCode 的自動完成等等。
因為熟悉 Typescript 所以導入此專案除了初期建制外,有效減少了開發時間。


Nilvana™ Stack

公司的主要產品之一,可以滿足不同任務需求並提供使用者所需要的 AI 軟體,同時也搭載了熱門的 AI 框架。 其中的主控面板 Dejavu 前端是由我獨自開發,因設計需求所以畫面操作較為複雜,實作上有到了許多困難,但所幸後續參考了許多優秀的網站也獲得了解決。

此產品中包含了許多應用,其中使用到了許多框架與套件,包括 Vue.js /React 。


Nilvana™ Members
使用者購買產品之後註冊保固的會員網站。前端部分由我負責開發,其中使用 Vue.js /GSAP 進行實作,包括 RWD。此專案也運用精巧的過場動畫來提昇整體使用者體驗。

 Pm0wwk0ioxovy0yadcyt

潔客幫 Jackercleaning, Front End Develop, May 2019 ~ July 2020

潔客幫預約系統 

- 在此專案中主要負責設計複用性高的架構設計。因應行銷方案可能高頻修改而導致開發上的困難,採用前端路由控制結帳方案系統。開發完成之後剛好有幾次的行銷方案大修改,在彈性的架構下很好地解藕了各種行銷方案顯示邏輯的複雜性,並且為團隊帶來了效率的大幅增加。

潔客幫後台系統

- 專案中採 Element UI 組件庫開發。專案分為舊版維護與新版開發,舊版為 blade 架構,因應新需求與更友善的開發體驗也開發了前後端完全分離的架構,並採用了 page by page 的重構方式。重構之後有效提升營運夥伴們的工作效率。

Pm0wwk0ioxovy0yadcyt

潔客幫 Jackercleaning, Front End Intern , Feb 2018 ~ Nov 2018

主要負責新頁切版、使用 Vue.js / Vuex 、與後端夥伴合作串接以及協助正職前端測試。

Pm0wwk0ioxovy0yadcyt
-  技能  -

HTML/CSS

- Antd / ElementUI 
HTML5
CSS3
RWD
Styled-Component
SASS/SCSS
Tailwind
Bootstrap

Javascript

- 3 年 Vue.js (Vue2/vue3) 開發經驗,相套件全家桶均熟悉 

- Typescript 熟悉

- 圖表串接 (Echart, Apexchart) 熟悉

- 1 年 React 開發經驗

- Webpack 開發經驗

- Canvas 開發經驗 (Fabric.js)

- Electron 開發經驗

- E2E/Unit Testing (Cypress, Jest) 

- WebGL (Three.js)


Others

- Express 開發經驗

- Python 開發經驗

- Docker 使用經驗
- Git / Git flow

- GitLab CI

- Scrum

- 前端經歷 -

Nilvana™ Vision Studio

使用 Vue3 / Pinia / Typescript / Socket.IO 建構的 SPA 標註工具與模型管理應用,同時支援多人協同操作。
標註工具的實現對我來說是一件非常具突破性的工作,整合了多人協同操作並且在保持一定的性能水準下提升使用者體驗與交互。
同時因為架構龐大產生許多需要複用的需求,包括 UI 元件與業務邏輯。因此設計了許多共用的元件與 hooks 方便開發使用,經過粗算節省約莫 20% 開發時間。
其中也因應後端複雜的 Schema,在前端架構上導入 Typescript 增加了整體 codebase 的穩固性並減少了心智負擔,配合 VSCode 也節省了許多開發時間。
Paragraph image 02 00@2x

Nilvana™ Dejavu

使用 Vue2/ Vuex 建構的 SPA。負責 Stack 的所有套件管理與通知中心,最核心的功能就是各種數據的即時監測。設計稿中整體前端操作與畫面呈現都比較困難與複雜,在開發初期遇到了不少問題,在參閱了許多優秀網站後得到了靈感並解決。
圖表部分實作了做拖曳換位功能,使用套件上與樣式客製上遇到了困難,在無數的實驗與摸索下才調整出符合預期的操作流。並且針對監測數據圖表有做性能上的提升。
並串接 Socket.IO 實作通知中心與各套件的狀態切換。
Paragraph image 02 00@2x

Nilvana™ Face Enrollment

使用 Vue2 / Vuex 建構的 SPA。人臉辨識的應用程式,前端部分相對前兩個應用來說相對沒那麼複雜。特別設計了卡片模式切換列表模式的過場動畫並著有效提升了使用者體驗。

Paragraph image 02 00@2x

潔客幫預約系統 

使用 Vue / Vuex / Vue-Router 建構的預約 SPA。主要設計彈性的架構,利用路由控制不同用戶有不同行銷方案的顯示邏輯。
選擇人員部分設計了複用性高的卡片組件,一樣針對不同的行銷方案能更方便的進行開發,有效提升行銷夥伴工作效率。

Paragraph image 02 00@2x

- 學 歷 -

輔仁大學, 學士學位, 應用數學系, 2014 ~ 2018

Powered By CakeResume