iT邦幫忙

鐵人檔案

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

前端菜鳥的react初體驗 系列

剛出道的前端工程師,希望能透過鐵人賽督促自己好好地把React學習一次,
也希望梳理自己的學習歷程,如果有一個人因為我的文章有所收穫,那就太值得了。

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

前端菜鳥的react初體驗

沒想到自己有一天會成為前端工程師,更沒想到自己會報名鐵人賽,但既然我能如願的成為前端菜鳥,想必也能順利地完賽吧! 為什麼選擇學習react? 我想,前端之路在摸...

2022-09-16 ‧ 由 chin_frontend 分享
DAY 2

前端菜鳥的react初體驗 Day2

點開官網,感謝世界,有中文!宇宙從這裡,開始和平。 const root = ReactDOM.createRoot(document.getElementBy...

2022-09-17 ‧ 由 chin_frontend 分享
DAY 3

前端菜鳥的react初體驗 Day3

在了解react的世界就是透過.js來創建element渲染到html上之後,就能回答我的第一個問題了。 什麼是Component? 我們可以把componen...

2022-09-18 ‧ 由 chin_frontend 分享
DAY 4

前端菜鳥的react初體驗 Day4-生命週期

什麼是生命週期 在問什麼是生命週期之前,我意識到,我應該先問的問題是:為什麼要有生命週期? 為了要讓一切組件化,所以react裡面的所有html element...

2022-09-19 ‧ 由 chin_frontend 分享
DAY 5

前端菜鳥的react初體驗 Day5-State

昨天談到生命週期,在react的世界裡面,一個element會有出生(Mounting)、變化(Updating)與死亡(Unmounting)。而在Updat...

2022-09-20 ‧ 由 chin_frontend 分享
DAY 6

前端菜鳥的react初體驗 Day6-State與Prop

昨天提到狀態改變了,就會更新。所以state如果有變化,就會觸發componentDidUpdate()。不過,在react中,還有一個很早就出現的Prop,也...

2022-09-21 ‧ 由 chin_frontend 分享
DAY 7

前端菜鳥的react初體驗 Day7-State與Prop(2)

昨天提到,Props不能從內部改變,但是可以從外面改變,到底是甚麼意思呢?下面的程式碼是一個「傳來的props的值是一個state」的範例,我們先一眼掠過就好!...

2022-09-22 ‧ 由 chin_frontend 分享
DAY 8

前端菜鳥的react初體驗 Day8-事件處理

昨天講了其實Props也可以修改,而在改Props的時候,我略過了一個事件沒有談,今天就來講講react的事件吧! 在原生js裡面,我們有三種方法可以綁定事件。...

2022-09-23 ‧ 由 chin_frontend 分享
DAY 9

前端菜鳥的react初體驗 Day9-事件處理(2)

今天要來談談如何透過事件來修改值,也就是如何修改state。但在這些事情之前,我們需要先釐清一些跟React無關,而是js本身的概念。 在js裡面,如果寫一個f...

2022-09-24 ‧ 由 chin_frontend 分享
DAY 10

前端菜鳥的react初體驗 Day10-資料綁定

確診了TAT,覺得完賽越來越困難與遙遠了。 今天要來討論的是react的資料綁定,最最簡單的就是第二天寫Hello Andy的時候,在{}裡面放入變數。 con...

2022-09-25 ‧ 由 chin_frontend 分享