鐵人檔案
2019 React hooks 的流行讓 React 生態圈產生很大的改變，藉由 30 天的挑戰，讓想學習 React 的人了解以往 class based 的開發方式與最新 React hooks 開發方式的差別，並且會以 hooks 的開發方式為主，也加深自己對 React 的了解。
到昨天為止都著重在 JS 的部分，基本的功能已經可以完成了，但除了功能以外，網頁應用的外觀也是很重要的，所以今天就暫時把 JS 擺在一邊，看看在 React 中...
原本今天要介紹其他主題的，但後來想想既然昨天都介紹 inline-style 了，今天就介紹另一種 styling 的方式 - styled-component...
大家好，經過兩篇 style 的介紹，今天總算要回到處理邏輯的部分了。 一般在開發應用時，常常會需要根據特定 condition 做邏輯判斷，除了一般我們熟知的...
今天要來介紹在 React 中如何建構最基本的 form。 重點可以歸納出這幾項： 建立 state 變數，且與 input value 做綁定 設定 onC...
講到 SPA（single page application）與傳統網頁的差異，應該很多人會想到傳統網頁跳頁往往會有一段載入時間，導致畫面空白，讓使用者需要對著...
今天開始會進入 React 中比較進階的主題 - state management在前幾天中我們介紹了 state，也介紹了 props，我們了解一個 comp...
今天將直接實作 redux，如果不知道 redux 運作概念的讀者可以回去看看昨天的概念介紹喔～今天嘗試將 dark theme 與 light theme 實...
昨天建立了 redux 的三元素 action、reducer 與 store，也將它們用 provider 包住會用到 state 的元件，今天來試著在元件中...
今天要介紹另一個 hooks - useReducer。光看第一行有些讀者可能就會有一些疑問了，udeReducer？看起來跟 redux 的 reducer...
昨天介紹了 useReducer 的用法，但是還缺少了 global state 的機制啊？怎麼會說可能可以不需要 redux 了？今天就來介紹 context...