Resume

PDF Link

Side projects

• A-Tree (Chrome extension for Github users)

  Repo: https://github.com/shinenic/a-tree

  Chrome Extension: https://chrome.google.com/webstore/detail/a-tree-github-review-help/niogapfhnkbjmpnnobldcekclbgkbiah

  針對 Github (以及 Enterprise)使用者在瀏覽 Repositories 方便以及 Review Pull requests 下的使用情境， 製作 Tree view / file search / switch between commits/pulls 等快捷方便的 Extension 提供開發者使用

  使用技術

  • React
  • Material-UI
  • React-window (Apply virtualization for large repositories and pull requests)
  • React-query
  • Webpack

• 台中歌劇院導覽系統

  https://ntt360.weacloud.org (for mobile)

  使用React整合VR軟體KRPano完成SPA網頁應用程式，並使用XState管理複雜的使用者流程，來建立順暢的使用體驗。

• React-Krpano-Hooks (npm library)

  Npm: https://www.npmjs.com/package/react-krpano-hooks

  Demo: https://shinenic.github.io/react-krpano-hooks/#/

  使用React hook整合VR軟體KRPano成獨立custom hooks，用以幫助React開發人員能快速串接KRPano並取得其API以及狀態資訊等等。

• 使用狀態機&React的獨立Component練習

  • Picture Carousel with Drag & Pinch Actions(Mobile-First)

    Demo: https://gp8p3.csb.app/

    實作可縮放以及拖曳的圖片幻燈片，並使用各個狀態來控制增進使用者體驗的細節

  • Toast component

    Demo: https://codesandbox.io/s/xstate-react-toast-with-counter-mnrzf

    使用狀態處理Toast從出現到消失以及暫停等等的各種狀態，再依狀態顯示不同的Style