Yasncrxb18y0tb1vx9cw

蔡敏佳 Mandy 

目前任職好房網-前端工程師,擁有網站開發、 Ul 設計、前後端工程師協作專案經驗。大學畢業後擔任網頁設計師,從專案中接觸到程式碼,並且利用業餘時間進修線上課程,在專案中開始撰寫基礎切版與互動,從中漸漸培養出興趣,想更深入了解網站開發,離開工作加入 ASTRO Camp 全端培訓營,加強 HTML CSS JavaScript 基礎,實作更多類型的網站,目前還在前端菜鳥階段繼續努力中,請大家多指教。


職位:前端工程師
應徵地點:Taipei,Taiwan

聯絡電話: 0929950315

E-mail      : [email protected]

GitHub    : https://github.com/mandy0315

作品集     : https://mandy0315.github.io/mandy-portfolio/#works


開發技能

Frontend


  • HTML5: 頁面架構 。 
  • CSS3: 頁面樣式。
  • Sass / SCSS :
    使用巢狀構造、變數、mixin。 
  • Tailwind CSS / Windi CSS:
    框架撰寫樣式。
  • JavaScript(ES6):
    控制元素和撰寫功能。



  • jQuery: 製作互動特效。
  • Vue3.js: 開發網站建立元件;
    Vuex / Pinia: 狀態管理。
  • React.js:
    JXS 撰寫 HTML ; Hook 方法控制元件。
  • SVG: 製作動畫。
  • Git : 建立。

Backend & Design


  • Ruby on Rails: 基礎 CRUD 開發。
  • Sketch: 設計大型網站。
  • Photoshop:
    製作合成圖像與設計活動網站。
  •  Illustrator:
    設計向量圖案與設計活動網站。  

  • After Effect:
    製作動畫與搭配 bodymovin 插件。
  • Wordpress 開發模板網站。


工作經歷


好房國際股份有限公司,前端工程師, 2021/9 ~ 

  • 使用 Vue 3 框架協助與開發改版網站與功能。
  • 使用 JavaScript 維護舊版網站。
  • 研究 JavaScript 套件 、 Vue 3 相關套件。

Company@2x

ASTRO 5X 全端培訓營, 2021/3 ~ 2021/6

  • 終端機與 Git 指令, 建立、修改、上傳、拉下、分支切換...等版本控制。
  • Ruby 撰寫 Rails 網站框架,了解 CRUD 開發、 會員系統 、 資料庫建置。
  • HTML 標籤與 CSS 屬性的原理,與了解 Bootstrap5 框架了解網格、語法運用。
  • JavaScript 了解 ES6 語法與撰寫原生 JS 操作 DOM 執行 Node. js 環境。 
  • React 框架 JSX 製作與 Hooks 方法執行 Component。   

Company@2x

振作國際有限公司, 網頁設計師, 2019/9 ~ 2020/10

  • 使用 Wordpress 平台 Elementor 編輯器,在一週時間完成中型 RWD 形象網站。 
  • 手刻與改寫版型,改善現有模板製作客製化網站。
  • 研究 Wordpress 外掛,擴增與改善模板的文章 、 會員系統等功能。 
  • 製作 Wordpress 教學 PPT ,指導新人一天內了解基礎操作。 
  • 教學與推廣 SVG 網頁特效 , 強化網頁動態。 跨瀏覽器、跨裝置相容性問題處理。

Company@2x

維克數位設計, 網頁設計助理, 2018/8 ~2019/7

  • 研究 Hype3 軟體, 製做 RWD 動畫頁,縮短撰寫動畫時間。
  • 了解第三方套件,縮短時間撰寫功能區塊。
  • 完成公司官網 Web UI 設計 、 前端開發 。
  • 研究 TweenMax.js 、 Animate.css 動態特效。
  • 跨瀏覽器、跨裝置相容性問題處理。

Company@2x

聖誕老人國際有限公司, 視覺設計師, 2018/1 ~2018/6

  • 研究 Zeplin 軟體,改善與前端工程師頁面稿溝通問題。
  • 遵循 12 網格設計模板網站,針對小眾市場快速製作形象網站。
  • 設計 Facebook / Line / 網站的不同尺寸廣告圖、CIS 企業識別、海報。 

Company@2x

專案作品

專題復刻 CodePen - 2021


復刻知名網站 CodePen,主功能以 Ace 套件製作線上編輯器,透過 API 新增存取更改資料;並新增愛心、鎖定、留言等社群功能;結合會員系統使用 Rails Devise 套件與第三方登入,練習功能類型大型網站。


負責內容  架構建置 -> 手刻網站 -> API 串接互動與功能

  1. 架構建置與頁面切版。 
  2. 互動特效 - 漢堡選單 / 側邊欄 / points 按鈕 / 首頁打字 (使用 stimulus.js 與 JavaScript )。
  3. React 框架 - Grid 主頁與後端溝通合作修改 API 狀態與參數, 透過 Hook 方法更改 Grid 需要呈現功能與 Edit 頁面預覽畫面。。
  4. 串接API - Edit 頁-title 功能 / List Grid 鎖定呈現。

Paragraph image 00 00@2x

未來流通研究所商業網站 - 2020


負責內容  UI 設計 -> Wordpress 製作網站 -> 網站上線

  1. 設計 Web UI 以和風為主,吸引日商瀏覽者。 
  2. 使用 Download Manager 下載文章,綁定 Profile Builder 會員系統讓文章能透過會員登入進行購買與下載。 
  3. 使用 Popular Posts 熱門文章與 Favorites 珍藏文章,擴充文章使用功能,讓瀏覽者快速瀏覽文章。 
  4. 撰寫 TweenMax.js 製作 footer 煙火動態。

Paragraph image 00 00@2x

維克數位創意官方網站 - 2019


負責內容  UI 設計 -> 手刻網站 -> 後端交接

  1. 設計 Web UI 以公司 Logo DNA 構想,部門(大分子)的分工規劃網站。 
  2. 使用 Swiper 、 fontawesome、workshop 套件,快速時間軸輪播功能、遮罩、圖示。 
  3. 所有頁面動態使用 Animate.css , 縮減撰寫 CSS 動態兼容與行數。 
  4. 使用 TweenMax.js 製作首頁 banner DNA 動態。

Paragraph image 00 00@2x

路博邁活動網站 - 2019


負責內容 UI 設計 -> 手刻網站 -> 網站上線

主題提案、圖表繪製、桌機手機版視覺設計。

  1. 設計 Web UI 以故事性互動與圖表帶領瀏覽者了解三檔基金。 
  2. 撰寫 JQuery 偵測高度固定選單,瀏覽者可以隨時切換頁面。 
  3. 使用 Hype3 軟體,製作火箭起飛動畫,輸出 HTML 、 JavaScript 放入專案。 

Paragraph image 00 00@2x

Powered By CakeResume