鐵人檔案
在這次的鐵人賽中，我會以單元式的方式介紹 React.js 的各種 Hooks、Context、React router、Redux & Redux toolkit、React 動畫、React 效能優化及其他瑣碎 React 特性功能等...
希望能透過一系列 React 相關的主題幫助自己和讀者更加認識 React.js。
React 的表單驗證篇總共會三篇，這篇我們會自己手刻一個驗證輸入值是否合法的表單，而在後面兩篇文章，我將會介紹使用 custom hook 及有名的第三方函式...
這次我們使用 Custom hook 進行表單的驗證。 首先我們建立一個檔案叫 useInputValidate.js ，裡面將會寫一個 Custom hook...
Formik 介紹 在進行實作之前，先來認識一下 Formik 吧~ 如標題所說，Formik 是一個表單函式庫，而且還是 React 官方推薦的，相似的還有...
這篇主要會講述 Redux 的一些介紹，下篇才會開始進行實作。 Redux 是什麼? Redux 是專門管理 state 的函式庫，它可以將整個專案的 stat...
2022/08/03 補充 現在回來看發現自己以前寫的 Redux 還有很多要改進的地方，所以重構了一個範例，並使用了 custom hook useActio...
在這篇文章中，我們要來認識一個函式庫: Redux Toolkit。 Redux Toolkit 官網 Redux Toolkit 是什麼? 不知道讀者有沒有感...
在第 15 天的文章中我們做了一個範例，現在我們要用 Redux Toolkit 去改寫它。 第一步 我們將原本範例的 store 和 reducer 做改寫。...
此篇章不會從頭開始介紹 React Router，而是挑選一些它的功能去做介紹，因此本篇的範例皆是從 React Router 官網找的範例。 React Ro...
這篇要來介紹 React router v5 加入的幾個 hook，包括 useParams、useHistory、useLocation、useRouteMa...
這篇要來介紹一下一些能用 React 實現一些動畫效果的函式庫，首先介紹的就是本篇的主角 React Transition Group， React Trans...
