iT邦幫忙

鐵人檔案

2023 iThome 鐵人賽
回列表
Modern Web

用 React 來認識 JavaScript 的原理概念 - 30 天認識 React 系列

React 框架沿用了大量的原生 JS 概念,掌握 JS 概念後, React 就不會太難懂,透過學習 React,同時深入理解 JavaScript 的原理和概念,React 是由 Facebook 開源的 JavaScript 函式庫,以元件化為主要特色,元件化的設計讓我們在開發的時候可以重複使用, React 將這個概念推廣到前端框架中,讓元件化成為現在網頁開發的重要概念,就讓我們用 30 天來認識 React 及 JavaScript 吧!

參賽天數 6 天 | 共 6 篇文章 | 10 人訂閱 訂閱系列文 RSS系列文
DAY 1

Day 01 長得像 HTML 的 JSX

學習 React 之前,可能需要有一點 JS 的底子 React 中沿用了大量的 JS 的觀念 如果不太懂 JS 觀念,在學習 React 過程可能會很挫折 廢...

2023-09-16 ‧ 由 ning_chang 分享
DAY 2

Day 2 Props

Props 是什麼 用生活中的例子來說,Props 可以用球來作為說明範例 在 React 中,我們會用 Props 來傳遞參數,好讓其他的元件也能夠使用 Pr...

2023-09-17 ‧ 由 ning_chang 分享
DAY 3

Day 03 - React component

React 中的程式碼是由 component 組成,React 本身的架構設計也圍繞在 component 上,但不是只有 React ,Angular 、...

2023-09-18 ‧ 由 ning_chang 分享
DAY 4

Day 04 - 從 Class component 轉變到 Hook

React 從版本 16.8 推出 Hook,在 16.8 以前都是使用 Class component ,今天我們會提一下為什麼會從 Class compon...

2023-09-19 ‧ 由 ning_chang 分享
DAY 5

Day 05 - React useState

為了方便理解,我們今天就用計數器來解釋這個 Hook 如果用香草 js 來寫的話, 會需要找 DOM 元素,並且設定監聽事件, 雖然以計數器這個例子來說,應該...

2023-09-20 ‧ 由 ning_chang 分享
DAY 6

Day 06 - React useEffect

我們在寫函式時,基本上都會回傳 return 值,但如果今天除了 return 值以外的元素,因為 return 值的不同而有所變化,需要做出對應的渲染呢? u...

2023-09-21 ‧ 由 ning_chang 分享