iT邦幫忙

鐵人檔案

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

從零開始學習React 系列

喜歡從做中學,邊學邊記錄,純粹自我挑戰。

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

Day21 React useEffect Hook

在 React component 做資料 fetch、subscription、或手動改變 React component 中的 DOM 都是 side ef...

2021-10-06 ‧ 由 maline77 分享
DAY 22

Day22 React-Router

Router(路由),是用以規畫網站路徑用,React Router是根據URL 中使用的Route(/對於主頁、/about關於頁面等)有條件地呈現頁面組件加...

2021-10-07 ‧ 由 maline77 分享
DAY 23

Day23 create React Navigation

昨天己經安裝了react-router-dom,在index.js頁面中導入 BrowserRouter,在App.js頁面中導入Route 和 Switch並...

2021-10-08 ‧ 由 maline77 分享
DAY 24

Day24 Create Image Gallery in React

在React中用bootstrap card建立圖片庫,並用Array.filter功能,點選上面的分類Button可選出不同類型的餐點。將Menu.js中資料...

2021-10-09 ‧ 由 maline77 分享
DAY 25

Day25 React Router useParams

我們可以在一般的靜態URL網址上加上動態路由參數,在 URL 中設置動態參數允許路由在將 URL 的動態參數傳遞給該組件時呈現相同的參數內容,以便它可以根據參...

2021-10-10 ‧ 由 maline77 分享
DAY 26

Day26 React Router useLocation

useLocation 函數是當 URL 網址改變時useState()會返回一個新的包含有關目前URL的狀態和位置的物件函數。每當URL網址有變更,則 use...

2021-10-11 ‧ 由 maline77 分享
DAY 27

Day27 Router useParams 小實作

在 URL 中設置動態參數傳遞給指定參數組件。 在App.js 的Route path="/cards/:title",指定參數,並將d...

2021-10-12 ‧ 由 maline77 分享
DAY 28

Day28 React - Countdown Timer

import React, {useRef, useState,useEffect} from 'react'; const Ctime = () =&gt...

2021-10-13 ‧ 由 maline77 分享
DAY 29

Day29 React - Styled-Components

styled components是 React 和 React Native 開發人員構建的React css library,是一個 CSS-in-JS...

2021-10-14 ‧ 由 maline77 分享
DAY 30

Day30 小實作 Image Preview Box

終於完賽了,很感謝iT邦幫忙鐵人賽這個活動,讓我在30天內因為要發文而不斷的學習,原本是一個下了班就坐在電視機前面不停轉台的沙發馬鈴薯,這30天的參賽日晚上都...

2021-10-15 ‧ 由 maline77 分享