iT邦幫忙

鐵人檔案

2023 iThome 鐵人賽
回列表
自我挑戰組

React 個人讀書會 系列

大家好!

目前工作開發是使用 Vue 框架,那為什麼會進行這次的 React 個人讀書會呢?是因為看了一部 Youtube 上的影片 (2020 Vue vs. React 前端擂台戰),了解到原來 React 有如此多的優點,因此就想來一探究竟。

React 個人讀書會的內容會以 Udemy 上的課程: The Ultimate React Course 2023: React, Redux & More 為主,我會將課程內容內化成自己的知識,來完成這次的 React 學習之旅。

鐵人鍊成 | 共 30 篇文章 | 9 人訂閱 訂閱系列文 RSS系列文
DAY 11

Day 11 - useState:基於當前狀態更新值

多次調用 set 函式 這裡有一個簡單的情境,有一個初始值為 20 的 age 變數,我們想要在按下按鈕時將 age 增加 1。 function App()...

2023-09-26 ‧ 由 秘密基地 分享
DAY 12

Day 12 - 根據狀態計算:派生狀態

什麼是派生狀態(Derived State)? 在 React 中,派生狀態是指從現有的某個狀態或屬性計算出來的狀態,這篇文章將探討派生狀態的概念,以及如何運...

2023-09-27 ‧ 由 秘密基地 分享
DAY 13

Day 13 - 打造靈活的元件:Children Prop

什麼是 Children Prop? 在 React 中,Children Prop 是每個 React 元件會自動接收的一個特殊屬性。 // 每個元件都會有...

2023-09-28 ‧ 由 秘密基地 分享
DAY 14

Day 14 - 屬性的深層傳遞:Prop Drilling

什麼是 Prop Drilling? 當一個父元件包含多個嵌套子元件,並且子元件需要最外層父元件的資料時,我們需要將資料從最頂層傳遞到最底層,讓子元件能夠訪問...

2023-09-29 ‧ 由 秘密基地 分享
DAY 15

Day 15 - 執行副作用:useEffect

為什麼需要 useEffect? 以下是一個範例,我們一開始透過 fetch 方法從遠端 API 取得資料,並將取的回來的資料 data.Search 透過...

2023-09-30 ‧ 由 秘密基地 分享
DAY 16

Day 16 - useEffect 的好麻吉:Cleanup Function

什麼是 Cleanup Function? 在 React 中,useEffect 允許我們執行副作用操作,同時還提供了一種清理這些副作用的機制。 Clea...

2023-10-01 ‧ 由 秘密基地 分享
DAY 17

Day 17 - React Hooks 的規則

我們已經介紹了一些 React Hooks(像是 useState 和 useEffect),在今天的文章中,我們將探討 React Hooks 的工作原理以...

2023-10-02 ‧ 由 秘密基地 分享
DAY 18

Day 18 - 解鎖重用邏輯的力量:Custom Hooks

什麼是Custom Hooks? Custom Hooks 的核心概念是可重用性,在 React 中,我們可以將可重用的邏輯封裝成 Custom Hooks,...

2023-10-03 ‧ 由 秘密基地 分享
DAY 19

Day 19 - DOM 元素引用:useRef

什麼是 useRef? useRef 是 React 提供的內建 Hooks 之一,它用於創建一個稱為 ref 的物件,這個 ref 可以用來儲存和訪問在多次...

2023-10-04 ‧ 由 秘密基地 分享
DAY 20

Day 20 - 重返 Class-Based 元件之旅

在 React 16.8 版本以前,開發者使用不同的方法來撰寫 React 元件,這種方法涉及使用 class 和生命週期方法。 儘管如今開發者更傾向於使用函...

2023-10-05 ‧ 由 秘密基地 分享