Profile 00 00@2x

江鈺棋 Kang 


曾任職媒體單位編輯,在職期間開始自學前端技術,目前擔任 UI 工程師,負責視覺架構企劃。我喜歡從鑽研陌生事物中獲得樂趣,熱愛網頁開發、學習新技術。我具備和跨領域客戶溝通的經驗,在每一個職場階段,我都追求盡善盡美,帶給公司更多貢獻並共同成長。

我已累積實作了 20 個以上大大小小的專案作品,包含  API 串接與  Vue.js 框架(請看下方作品集);我把學習的知識點,整理成 56 篇技術筆記(請看我的技術部落格)。  


[email protected]

技能


Web Layout

  • 熟悉 HTML5、CSS3
  • 熟悉手寫 RWD 響應式網站
  • 熟悉 Bootstrap 規劃網頁排版
  • 熟悉 Sass 前處理器


JavaScript

  • 熟悉 JavaScript 及 ES6 標準
  • 熟悉 jQuery 製作及網頁互動動畫效果
  • 熟悉 AJAX / JSON 串接 RESTful API
  • 使用 Vue.js 開發
  • Canvas 基本操作 


Tools

  • 熟悉 GIT 作為版本管理工具
  • Webpack

工作經歷


麥斯創新科技, Apr 2020 ~ Now

前端 UI 工程師

  • 視覺架構企劃
  • 網頁建構

定贏傳媒, Jan 2017 ~ Jan 2019 

媒體事業部編輯

  • 負責跨部門的內容生產需求,包括:企業代編刊物、文宣、手冊、臉書社群經營 
  • 執行科技部生醫產業創新執行中心專案的全年度的內容編採,獨立完成整個專案,包括:企劃、採訪、撰寫、聯繫協調 
  • 以跨領域的觀點,運用淺顯易懂的說明方式,使讀者能快速閱讀並理解生技新知 
  • 協助新進人員之教育訓練

愛吃客整合行銷, Jan 2016 ~ Dec 2016

特別助理

  • 協助辦理各項任務與專案
  • 行政事務
  • 文件檔案資料彙整


學習成果

  • 實作了20 個以上大大小小的專案(請看下方作品集)
  •  我把學習的知識點,整理成 56 篇技術筆記。
  •  其中 40 篇跟 Javascript 有關。 
  • 專案的實作細節記錄在 Github 
  • 使用 Hexo 配合 Github Pages 架設個人 Blog。

Ajax / API 串接作品


Profile 03 00@2x

新北市 Youbike 查詢 - Vue.js

新北市 Youbike 站點查詢。

  • 切換地區資料
  • 串接 Google Map,顯示站點地理位置
  • 分頁功能

Github| Demo

JavaScript / jQuery 小作品


Profile 03 00@2x

Todo List - Vue.js

使用 Vue.js 建立待辦事項清單功能。

  • 可動態切換 ClassName 與 style 
  • 運用指令與修飾符
  • 表單資料綁定
  • 待辦事項的動態新增、刪除、修改
  • 製作頁籤切換功能 
Github| Demo | 筆記

Profile 03 00@2x

瀑布流相簿 - JS

實現 Pinterest 瀑布流版面。

  • 瀑布流的圖片定位 
  • 瀑布流的圖片排序 
  • 瀑布流的圖片加載功能

Profile 03 00@2x

牌卡配對遊戲 - JS

選取偶數相同的圖片配對。

  • 以 Math.random() 及 sort() 方法,隨機排列圖片順序
  • 運用陣列及 concat () 方法,製作成對卡片
  • 限制每一輪遊戲只能翻 2 張
  • 設定卡片配對條件
  • 將成功配對的牌組從畫面隱藏
  • 移除點選狀態,重新開始遊戲
Github| Demo | 筆記


Profile 03 00@2x

Pomodoro - JS

番茄鐘。

  • 一個番茄鐘包含工作 25 分鐘、休息 5 分鐘
  • 可開始、暫停、重置時鐘
  • 可切換隱藏按鈕隱藏按鈕
  • 將該時段任務與完成時間長度顯示在下方列表
Github| Demo | 筆記
Profile 03 00@2x

骰子遊戲 - JS

骰子遊戲,達到累積分數後顯示勝者。

  • 擲出 1 ,則立刻切換倒下一個玩家,且此輪不累計分數
  • 連續擲出 2 個 6 ,則該輪玩家目前累積總分歸零
  • 可選擇將該輪所得分數到累加到總分裡 
  • 需可判斷哪一個玩家達到勝利標準 
  • 可由玩家輸入自定義的獲勝標準
Github| Demo | 筆記

Profile 03 00@2x

Slider - JS

 實作圖片 slider。

  • DOM 操作圖片切換
  • 運用 setInterval() 達成自動播放 
  • 可暫停播
Github| Demo | 筆記

Profile 03 00@2x

倒數算數遊戲 - JS

60 秒倒數算數遊戲。
  • 以  setInterval() 製作倒數效果
  • 以 Math.ceil() 及 Math.floor() 取得數字
  • 取得隨機生成的運算符號
  • 需判斷答案是否正確後累計分數
  • 開始及結束遊戲的換頁效果
Github | Demo


Profile 03 00@2x

麥好冰 - Vue.js

線上課程作業,自行設計內容與畫面,包含基本電商前後台主要功能。

純手刻切版 


Paragraph image 05 00@2x
Paragraph image 05 01@2x

實作功能

  • Flexbox 盒模型 
  • 手刻靜態網頁 
  • 運用 keyframes 製造公轉、陰影、跑馬燈效果 
  • 立體交疊效果 
  • RWD,隨畫面寬度顯示不同樣貌。 
  • 串接 Google Maps API 顯示位置。 
  • Parallax 視差捲動效果
  • iframe 顯示影片
Demo 1 | Demo 2 | Demo 3 | Demo 4
Paragraph image 05 00@2x
Paragraph image 05 01@2x

 

Bootstrap 切版


Profile 03 00@2x

實作功能

  • Grid 排版
  • 元件運用
  • Slider 圖片滑動效果
  • iframe 顯示影片
  • Dropdown 選單
  • 文字滑動動畫效果 
Demo 

學歷

國立政治大學, 碩士, 哲學系, 2009 ~ 2014

Company@2x

國立政治大學, 學士, 哲學系, 2005 ~ 2009


Company@2x
Powered by CakeResumePowered by CakeResume
Powered by CakeResumePowered by CakeResume