#UI/UX #Front-end #視覺美感 #邏輯思考
視覺表現的能力，及善於邏輯思考、獨立作業的人格特質，建議我去了解網頁的製作。從Udemy線上課程中萌發對前端工程的興趣，便在2023年報名相關職訓課程，發想出
貓知識測驗小遊戲「貓奴檢定」，於今年1月自學 React 將此專案實現，並加以摸索網頁動畫製作平台 Rive 將所畫的貓貓動態化，為「貓奴檢定」建立一個有互動效果的介紹網頁。
期許能在重視覺表現的公司裡，發揮己長，參與一件件酷炫網頁的製作!
喵起來 - 貓貓咖啡廳預約、認養複合式平台
🖼前期發想 🎨網頁 Layout (製作中)
🐈貓奴檢定 - 貓知識測驗小遊戲 🎮Link 🖥Github
#React #useState #useEffect #SCSS
每次遊玩都從題庫隨機取題，以 React 各式 hook 完成進度切換、成績計算及題目解析等功能，並使用 html2canvas 達成測驗結果下載。
🐈貓奴檢定 - 設計發想介紹網頁 🎮Link 🖥Github
#React #SCSS #Rive
介紹貓奴檢定的視覺設計及看不到的程式小巧思，將本來置於 Behance 等平台的平面內容，使用 Rive 及 CSS 加上一個有互動性的登陸頁，並監聽滾動事件，以優化使用者體驗。
🥇React Quiz - React 知識測驗 🎮Link 🖥Github
#React #useReducer #json-server
搭配線上課程所提供的 CSS 所建立的 React 測驗小遊戲 ，利用 Json-server 建立 Fake api 串接測驗題目，及 React useReducer 更新及管理複數 state 。
🎬Usepopcorn - 電影搜尋 🎮Link 🖥Github
#React #useEffect #Data fetching #Custom hooks #Local storage
搭配線上課程所提供的 CSS ，使用 React 串接電影資訊 api ，供使用者英文輸入搜尋電影，並提供評分電影、加入片單至 Local storage 等功能，且嘗試製作 Custom hooks ，利於工作上與他人共同開發。
🌞Classy Weather - 一週天氣預報 🎮Link 🖥Github
#React #Data fetching #Class components
搭配線上課程所提供的 CSS ，使用React 串接氣象 api ，供使用者英文輸入指定地區，即時顯示一週天氣預報，並採用Class components撰寫，利於工作上維護 React 16 前的專案。
