您好，我是 Josh!
- 10 年 WEB 獨立及團隊開發經驗
- 主要服務後台系統及活動頁面之專案
- 新創: 提出具體產品創新想法，通常不是會議中最安靜的那位，樂於參與討論分享觀點
- 跨國: 13 種多國語系設計及海外隱私權等 UI/UX 經驗
- 資安: 在 TeamT5 公司經驗中更會考慮駭客攻擊點，預防各種 API/輸入框 入侵等設計
- Mobile: 兩次獨立 React Native 專案經驗，能針對 Mobile WEB 及後端 API 及 Webview 提供設計意見
- AWS: 曾於代理商負責相關項目及 Rails 開發經歷，在後續專案提供部屬及開發流程設計
- 人格特質: 邏輯學家 INTP
工作經歷
Front-End Developer • TeamT5 杜浦數位安全
- ThreatSonar
- 因 Rails 後端開發背景，擔任 WEB Project 前後端分離計劃顧問
- 官方網站維護
- 以 AWS S3/Cloudfront 及 Next.js 取代 Firebase/Cloudinary，降低十倍預算及提升網站可靠性
- 翻修 50% 以上 legacy code 以及調整圖片大小，避免資源過度消耗及檔案過大等問題
- 使用 AWS SDK(JS)/TypeScript/ Pica.js 等技術實作 file-upload-system ，提供使用者自動縮圖及外部檔案上傳至雲端取得公開網址
- 透過 Chrome Performance 及 WebPageTest 等工具數據化檢測效能
- 在 ChatGPT 初期功能，利用爬蟲進行 SEO 測試，並在例會簡報獲得高層關注 :D
- 與 MIS Team 盤點 DNS 紀錄，減少 CNAME 重新 query 問題
- CYBERSEC 2022 資安大會活動頁面
- 嘗試 Svelte 框架進行開發並與 HR 及行銷部門提出 Chrome Console 徵人彩蛋 :)
- CYBERSEC 2023 資安大會活動頁面, InteOp23 日本活動頁面
- 以 Preact.js 輕量且接近 React.js 實作習慣進行開發
- 以 Tailwind CSS 快速編寫 CSS，更搭配 @apply 至 CSS Module 保持模組化彈性
- 沿用官網 AWS S3 + Cloudfront Deploy 流程，確保架構一致性
- 外部廠商系統資安問題反映: 密碼明碼傳輸及登入權限設計問題，再次獲得高層關注 :D
Front-End Developer • 海碩集團 鑫享科技
2019/5 - 2021/10
- B2B/B2C 後台系統
- 採用新版之 React Hook 及 Context API 等技術，領導集團內全新 IT 前端專案並覆蓋全球 50 多國
- 使用 Formik、Yup 及 React.memo 等技術設計單頁近百格欄位表單，確保欄位間的驗證和效能影響
- 使用 WebSocket 實作留言互動及即時通知功能，而且可以用 Emoji 😀
- 內部提案使用 Github Actions 建置 CI/CD 流程 (註: 該服務於 2019/8 月推出)
- 中國及海外伺服器分離設計意見提供
- 官方網站改版
- 接手外部廠商原始 HTML/CSS，並於一個月內完成主要技術架構(NextJS, i18n)
- 前端成員內部訓練
- 透過 Standing meeting 互相討論各自進度，以及提升友好的工作默契
- 透過 Pull Request Code Review 機制，交換技術意見提升程式碼可讀性及確保需求一致性
Front-End Developer • Fullinn 滿房寶房宿系統 (新創團隊)
2017/12 - 2019/04
- 滿房寶旅宿管理系統: WEB
- 在既有規劃，協助轉移 Redux + Reducer 到 Apollo 2.0
- 使用 React.js 及 GraphQL，進行 OTA 設定平台及訂單系統等開發
- 滿房寶旅宿管理系統: Mobile
- 協助外部廠商 React Native 實作諮詢，並接手後續需求及上架流程
- 引入 Firebase(Push notification) 及 Code Push，降低 Deploy 流程及整合推播服務
- 滿房寶旅宿官網設計師
- 領導主要前端架構設計，以 Next.js 提供之 Server render 概念框架，開發 SEO 及有效架構之網站應用程式，使民宿業者可透過管理系統快速建立官方網站
- 引入 Flow.js 及 Eslint 等程式碼檢查工具至專案，盡量減少 Code Review 產生的工作量以及提升考靠性
- 第一位客戶 台中「旅巷自在輕旅」青年旅宿，登陸 Google 後第一週即進入搜尋結果第一頁
Front-End Developer • CatFi (新創團隊)
2016/11 - 2017/11
- 以 React Native 提供之 JavaScript API ，開發近似原生 iOS, android 之行動應用程式
- 使用 Redux, Redux-saga 作為主要資料儲存傳遞及 Side effect 的處理
- 採 Server less 及 SPA 概念，使用 React Router、Github Page、Echart.js 完成圖表顯示功能
- 初期 REST API 格式設計
- Streaming 技術串接研究 (WebRTC, RTMP)
- 導入 Code Push ，提供使用者不須重新下載即可立即更新 APP 功能
- 導入 Fabric 回報系統，當使用者發生閃退等情形可回傳後台了解錯誤情形
- 導入 OneSignal 第三方推撥服務，降低營運及後端實作成本
Front-End Developer • myTreat (新創團隊)
2015/8 - 2016/5
- 領導初期 REST API 格式設計，並建構 API 設計流程使後端開發更為順暢
- 使用 PHP composer, decaffeinate(CoffeeScript -> ES6), Gulp.js 等技術，建立前端團隊開發環境
- 與設計師完成需求溝通後，依照設計稿(Zeplin, Illustrator)進行 CSS 切版實作
- 以 React Component 切割不同的 UI 元件，並透過 Fluxify 在不同元件中資料傳遞
- 在 Giftpack 公司化初期，協助在台投資人聯絡及公司建立事宜
Application Developer • Ecowork
2014/7 - 2015/7
- 以 Rails 等後端技術，協助資深工程師開發需求
- 獨立以 Rails, Angular.js 開發客服後台系統，提供客服人員確認使用者產品註冊、連線狀況
- 維護網通產品及 Cloud 連線之溝通模組，主要以 Ruby 以及 **** 溝通格式開發
- 研究實作 Cucumber、RSpec 完成客戶測試報告需求，並協助 DevOps 同事建立自動測試環境
- 研究實作 Vagrant 及建置上版作業流程，統一開發環境使新進同仁可迅速完成系統環境建立，更快瞭解上版作業
Demo Code
File upload system
- AWS SDK with S3 feature and IAM login flow
- Image resize features
- SPA, Static page without back-end hosting
Todo list
Vite + React.js + React Context/Reducer + Typescript + Github action(page)
短期工作
Vue.js 交易平台系統
- 使用 Vue 3 + Pinia + Nuxt.js 建構前台交易資訊模組與圖表介面
- 整合 TradingView Widget 與股票 API，實作即時股價顯示與最佳五檔行情 UI
- 使用 ECharts 製作多類型圖表(折線圖、圓餅圖)，提升數據可視化表現
- 基於既有客服系統框架進行功能擴充，依據使用者權限需求調整操作介面與資料存取邏輯
學歷
2009/9 - 2013/6
文藻外語學院
數位內容應用與管理系
技能
Front-End
React.js/Next.js
TypeScript
React Context
Redux
Tailwind.css
Sass
GraphQL
Vue.js/Nuxt.js(短期專案)
Back-End
Node.js
Koa
Rails
AWS(S3, cloudfront)
CI/CD
Docker
GitHub Actions
GitLab Runner
Mobile
React Native
Code Push
Fabric
TestFlight
Testing
Jest
Cucumber
Jenkins
