iT邦幫忙

鐵人檔案

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

React 學習之路 系列

用 30 天記錄 React 學習,與沒真的懂的 JS 的部分。

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

30 天 React 學習之路 (Day1)

React 的網路資源很多,這個系列只忠實紀錄 30 天閱讀 React 官方文件,消化吸後的所知所學,而文章也希望保持簡潔。學習 React 對過程中,也會針...

DAY 2

什麼是 JSX (Day2)

介紹JSX JSX 是一種在 JavaScript 裡面的標籤語法,讓我們可以在寫邏輯時使用 HTML 標籤。React 基本概念是:「建立元件,而不是樣板」。...

DAY 3

Render Element(Day3)

建立 React 應用程式最小的單位是 element。 —— React 文件 這句話好像可以有兩種意思, 在元件裡面只放一個 element,為 Re...

DAY 4

Components 與 Props(Day4)

當我們會寫基本的 Hello World 之後,就可以開始考慮擴展跟重組我們要撰寫的程式碼了。我們會把一段與其他程式碼基本上相異的,而內部彼此有關聯的程式碼,寫...

DAY 5

State 和生命週期(上)(Day5)

在講到生命週期之前要確認理解前面做過的兩件事: setInterval 去更新畫面的例子 記得有 class component 跟 function com...

DAY 6

State 和生命週期(下) 正確的使用 State (Day6)

在上一篇新認識了 Class 物件裡面會寫一個 local (元件內)的 state 去管理儲存元件的值,但這筆資料是存在記憶體裡的,並隨著元件的產生會進行初始...

DAY 7

事件處理(Day7)

React element 事件 VS DOM element 事件 React element 處理事件跟使用 DOM element 處理事件差異: 事件...

DAY 8

事件處理,延伸學習 function bind(Day 8)

<button onClick={this.deleteRow.bind(this, 'id')}>Delete Row</button&gt...

DAY 9

條件 Render ( Day 9 )

在 React 中,你可以建立不同的 component 來封裝你需要的行為。接著,你可以根據你的應用程式的 state,來 render 其中的一部份。...

DAY 10

列表與 Key ( Day 10 )

如果有使用過其他框架的經驗,可能會需要熟悉一下React 的寫法,是由 JSX 搭配迴圈去產生。以下羅列一些需要注意的地方: 常見使用 map、filter...

機器人幽默研究員的收藏
機器人幽默研究員的追蹤
機器人幽默研究員的Like
機器人幽默研究員的紀錄