用ChatGPT詠唱來點亮React＆前端技能樹

1 ChatGPT 基礎使用、設定
1-1 ChatGPT 註冊
1-2 示範：ChatGPT 與算術問題
1-3 利用Custom instructions（自訂指令）來打造工程師的專屬助手
1-4 讓ChatGPT 成為程式碼的開發/ 運維好夥伴

2 ChatGPT 請教教我：JavaScript & TypeScript 基礎
2-1 網頁基礎入門 - HTML、JavaScript、CSS
2-2 進階JavaScript、 ES6 語法& 語法糖
2-3 異步程序：Callback、Promise、async/await、Fetch 串接API
2-4 TypeScript ！ Enum ！泛型！
2-5 Class（類別）！ Object（物件）！物件導向OOP！

3 ChatGPT 請教教我：React 基礎
3-1 起始安裝、JSX 元素、元件、Props ！
3-2 State（狀態）！內容動起來！
3-3 運用JS 高階函數，進階JSX 組合元件！
3-4 Hook ！副作用（Side Effect）？ useEffect！
3-5 更多Hook ！ useCallback ！ useMemo ！自定義Hook！
3-6 ref ？ useRef ！ forwardRef ！ useImperativeHandle！
3-7 React & TypeScript！
3-8 React & axios！ API 串起來！

4 ChatGPT 請教教我：React 進階
4-1 React Redux 狀態管理
4-2 React Redux & Redux Toolkit！
4-3 React Redux & Redux-thunk！ API 參戰！
4-4 useReducer、useContext vs. Redux
4-5 NextJS ！路由系統！
4-6 Nx 框架！ Monorepo 架構！

5 ChatGPT 請教教我：自動測試
5-1 Jest 單元測試：基本介紹＆起始安裝
5-2 Jest 單元測試：完整語法＆教學
5-3 Storybook：UI 文件與測試

6 結語

作者簡介



一宵三筵 (黃韻儒) 

　　畢業於中興大學資訊工程學系。

　　大學專題以強化式學習做為研究主題、關注AI領域發展。畢業後從事前端工程師工作，專攻於React、NextJS等前端技術，並從前端領域不斷擴展技能樹到後端領域，目前職位為全端工程師。

　　偶爾會在IT邦幫忙上分享一些開發上的踩坑分享，持續找尋、嘗試多種方式來降低程式學習上的曲線與門檻，後來ChatGPT的問世，得以結合目前熟悉的前端技術，參加第15屆鐵人賽自我挑戰組，以《用ChatGPT詠唱來完成工作與點亮前後端技能樹》系列打入熱門文章。

　　LinkedIn: www.linkedin.com/in/韻儒-黃-397530215/
　　github: github.com/lalame888
　　IT邦幫忙: ithelp.ithome.com.tw/users/20135750/profile