iT邦幫忙

鐵人檔案

第 11 屆 iT 邦幫忙鐵人賽
回列表
Modern Web

React.js 從 【0】 到【1】推坑計畫 系列

2019 React hooks 的流行讓 React 生態圈產生很大的改變,藉由 30 天的挑戰,讓想學習 React 的人了解以往 class based 的開發方式與最新 React hooks 開發方式的差別,並且會以 hooks 的開發方式為主,也加深自己對 React 的了解。

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

【Day 10】CSS && Inline-style

到昨天為止都著重在 JS 的部分,基本的功能已經可以完成了,但除了功能以外,網頁應用的外觀也是很重要的,所以今天就暫時把 JS 擺在一邊,看看在 React 中...

2019-09-15 ‧ 由 老莫 Kyle 分享
DAY 12

【Day 12】Styled-component

原本今天要介紹其他主題的,但後來想想既然昨天都介紹 inline-style 了,今天就介紹另一種 styling 的方式 - styled-component...

2019-09-16 ‧ 由 老莫 Kyle 分享
DAY 13

【Day 13】Conditional Rendering

大家好,經過兩篇 style 的介紹,今天總算要回到處理邏輯的部分了。 一般在開發應用時,常常會需要根據特定 condition 做邏輯判斷,除了一般我們熟知的...

2019-09-17 ‧ 由 老莫 Kyle 分享
DAY 14

【Day 14】Form in React

今天要來介紹在 React 中如何建構最基本的 form。 重點可以歸納出這幾項: 建立 state 變數,且與 input value 做綁定 設定 onC...

2019-09-18 ‧ 由 老莫 Kyle 分享
DAY 15

【Day15 路由神器 - React-router 】

講到 SPA(single page application)與傳統網頁的差異,應該很多人會想到傳統網頁跳頁往往會有一段載入時間,導致畫面空白,讓使用者需要對著...

2019-09-19 ‧ 由 老莫 Kyle 分享
DAY 16

【Day 16】state management - redux 基礎概念

今天開始會進入 React 中比較進階的主題 - state management 在前幾天中我們介紹了 state,也介紹了 props,我們了解一個 com...

2019-09-20 ‧ 由 老莫 Kyle 分享
DAY 17

【Day 17】Redux 實戰演練

今天將直接實作 redux,如果不知道 redux 運作概念的讀者可以回去看看昨天的概念介紹喔~ 今天嘗試將 dark theme 與 light theme...

2019-09-21 ‧ 由 老莫 Kyle 分享
DAY 18

【Day 18】Redux 實戰演練(2)

昨天建立了 redux 的三元素 action、reducer 與 store,也將它們用 provider 包住會用到 state 的元件,今天來試著在元件中...

2019-09-22 ‧ 由 老莫 Kyle 分享
DAY 19

【Day 19】可能不需要 redux - useReducer

今天要介紹另一個 hooks - useReducer。 光看第一行有些讀者可能就會有一些疑問了,udeReducer?看起來跟 redux 的 reducer...

2019-09-23 ‧ 由 老莫 Kyle 分享
DAY 20

【Day 20】可能不需要redux (2) - contextAPI

昨天介紹了 useReducer 的用法,但是還缺少了 global state 的機制啊?怎麼會說可能可以不需要 redux 了? 今天就來介紹 contex...

2019-09-24 ‧ 由 老莫 Kyle 分享