iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

0 Like 0 留言 78 瀏覽

鐵人賽 Mobile Development DAY 23

30天使用chatGPT輔助學習APP完成接案任務委託系列第 23 篇

技術 [Day23] React native call api 後發生了什麼事？架構設計與流程說明

今天我們要來講一下關於 redux action app 架構設計。我們專案使用的 redux 工具是 redux-toolkit 按下送出後發生了什麼事？...

Tom Sir Coding bar ‧ 2024-10-07

0 Like 0 留言 110 瀏覽

鐵人賽 Modern Web DAY 10

前進React 生態系 : 技術應用與概念解析系列第 10 篇

技術 Day 10 - Redux Toolkit 原理解析

Redux Toolkit 相關套件必安裝套件: redux-toolkit : 簡化 Redux 的使用，讓開發者能更輕鬆地管理狀態和減少樣板程式碼，並且...

Jaren ‧ 2024-09-24

0 Like 0 留言 2109 瀏覽

鐵人賽自我挑戰組 DAY 24

用ChatGPT詠唱來完成工作與點亮前後端技能樹系列第 24 篇

技術【Day24】ChatGPT請教教我：React進階（二）- React Redux & Redux Toolkit！

目前這個系列已挑選ChatGPT、前端&React相關章節出版成書！感謝大家的閱讀與支持!《用 ChatGPT 詠唱來點亮 React ＆前端技能樹...

一宵三筵 ‧ 2023-10-08

1 Like 0 留言 729 瀏覽

鐵人賽 Modern Web DAY 26

從Vue學React！不只要會用，還要真的懂～系列第 26 篇

技術【Day 26】用實作學Redux Toolkit！完成一個購物車(下) - Middleware之處理非同步的操作

昨天已經看了一些RTK的基本用法，今天一樣是使用RTK繼續完成我們的購物車。雖然昨天已經完成了大部分的功能，可以把商品加入到購物車了，但是我們的商品清單目前是暫...

文科少女 ‧ 2023-10-02 ‧團隊曼陀號計畫V

0 Like 0 留言 492 瀏覽

鐵人賽 Modern Web DAY 25

從Vue學React！不只要會用，還要真的懂～系列第 25 篇

技術【Day 25】用實作學Redux Toolkit！完成一個購物車(上) - 基本設定＆基本用法

昨天已經先認識了Vuex和Redux這兩個狀態管理的工具了！今天則是會專注看怎麼把Redux使用到React上的部分。當我們想要在React上使用Redux時，...

文科少女 ‧ 2023-10-01 ‧團隊曼陀號計畫V

0 Like 0 留言 1406 瀏覽

鐵人賽 Modern Web DAY 26

你 React 了嗎? 30 天解鎖 React 技能系列第 26 篇

技術 [DAY 26] Redux 原理與 Redux Toolkit

在後面的幾天將會以 Redux Toolkit 來做說明，而在了解 Redux Toolkit，我們先來了解 Redux 的運作原理，在後面的操作上也會比...

Lala Code ‧ 2022-10-11

0 Like 1 留言 1651 瀏覽

鐵人賽自我挑戰組 DAY 30

30天深入淺出Redux 系列第 30 篇

技術 Redux 深入淺出 - [ Day 30 ] React RTK Query Typescript todo list - 新增功能 & 結語

今天是最後一篇了，我們接著完成我們最後的新增功能吧！其實新增功能與先前的部分沒有差太多，一樣我們先回到 todoApi 去處理新增的功能，如下： // sr...

LucianoLee ‧ 2022-10-11

1 Like 0 留言 1434 瀏覽

鐵人賽自我挑戰組 DAY 29

30天深入淺出Redux 系列第 29 篇

技術 Redux 深入淺出 - [ Day 29 ] React RTK Query Typescript todo list (更新 & 刪除)

前一篇我們完成了基本的 getAll request，並於畫面簡單呈現表單內容，那麼今天我們就接續完成他應該有的修改與刪除能吧！讓我們先回到 todoApi...

LucianoLee ‧ 2022-10-10

0 Like 0 留言 1136 瀏覽

鐵人賽自我挑戰組 DAY 28

30天深入淺出Redux 系列第 28 篇

技術 Redux 深入淺出 - [ Day 28 ] React RTK Query Typescript 實作

前一篇我們大致上了解了 API server 的運作與 todo 的格式，今天讓我們回歸主線，來使用 RTK query 整理我們的剛才的 todo APIs，...

LucianoLee ‧ 2022-10-09

0 Like 0 留言 1241 瀏覽

鐵人賽自我挑戰組 DAY 27

30天深入淺出Redux 系列第 27 篇

技術 Redux 深入淺出 - [ Day 27 ] React RTK Typescript ExtraReducer

前一篇我們完成了一個基本的 counter slice 和簡單的 reducer，今天我們試做 extraReducer 的部分，一樣我們簡單設定一個計分的 s...

LucianoLee ‧ 2022-10-08

0 Like 0 留言 1296 瀏覽

鐵人賽自我挑戰組 DAY 26

30天深入淺出Redux 系列第 26 篇

技術 Redux 深入淺出 - [ Day 26 ] React RTK Typescript 基本應用

接續前一篇的進度，我們已經設置好 store 了，接著我們來試做一個簡單的 counter 講解一下在 Typescript 的環境下如何處理我們的 slice...

LucianoLee ‧ 2022-10-07

0 Like 0 留言 2453 瀏覽

鐵人賽自我挑戰組 DAY 25

30天深入淺出Redux 系列第 25 篇

技術 Redux 深入淺出 - [ Day 25 ] Redux Toolkit Query 簡介

什麼是 Redux Toolkit Query? Redux Toolkit Query 官方簡稱 RTK Query RTK Query 是一種進階數據獲取和...

LucianoLee ‧ 2022-10-06

0 Like 0 留言 917 瀏覽

鐵人賽自我挑戰組 DAY 24

30天深入淺出Redux 系列第 24 篇

技術 Redux 深入淺出 - [ Day 24 ] React Redux Pokemon 換頁功能

前一篇我們已經完成大致上所有的功能了，今天篇稍微調整一下 UI 畫面，並讓我們的選單有上下頁的功能。我們已知回傳資料內有上下頁完整的 url 了，所以我們也...

LucianoLee ‧ 2022-10-05

0 Like 1 留言 866 瀏覽

鐵人賽自我挑戰組 DAY 23

30天深入淺出Redux 系列第 23 篇

技術 Redux 深入淺出 - [ Day 23 ] React Redux 非同步處理

如果一路跟到這邊的話應該會覺得處理上很容易，事實上確實也是如此，因為前面的規劃已經完成了，包含非同步事件的處理，這些也就只是 javascript 的基本觀念而...

LucianoLee ‧ 2022-10-04

0 Like 0 留言 1056 瀏覽

鐵人賽自我挑戰組 DAY 22

30天深入淺出Redux 系列第 22 篇

技術 Redux 深入淺出 - [ Day 22 ] React Redux 資金功能設定

前面的章節我們完成了完整的商品進貨購買功能，是時候算個帳了! 今天就是要把錢的部分給加進來，我們可以從先前的 Redux Toolkit 的專案內搬移 ass...

LucianoLee ‧ 2022-10-03

0 Like 0 留言 887 瀏覽

鐵人賽自我挑戰組 DAY 21

30天深入淺出Redux 系列第 21 篇

技術 Redux 深入淺出 - [ Day 21 ] React Redux 商品功能設定 - (蛋糕)

前篇我們已經完成咖啡與咖啡豆兩樣商品的搬遷，今天我們將蛋糕的部分也移植過來我們 React 的專案裡面，也順便加深使用的印象。還記得怎麼處理嗎？ Start...

LucianoLee ‧ 2022-10-02

0 Like 0 留言 957 瀏覽

鐵人賽自我挑戰組 DAY 20

30天深入淺出Redux 系列第 20 篇

技術 Redux 深入淺出 - [ Day 20 ] React Redux 商品功能設定-(咖啡＆咖啡豆)

前一篇，我們已經完成了咖啡商品的購買功能，以及示範了 React 的 component 拆分方法，那麼這篇我們就接續完成另一項進貨的功能吧！首先，我們先回...

LucianoLee ‧ 2022-10-01

0 Like 0 留言 987 瀏覽

鐵人賽自我挑戰組 DAY 19

30天深入淺出Redux 系列第 19 篇

技術 Redux 深入淺出 - [ Day 19 ] React Redux setup

前篇我們已經完成了基本的 Store setting，並透過 React Redux 的 provider 提供所有 component 來使用，其用意與 Re...

LucianoLee ‧ 2022-09-30

0 Like 0 留言 1429 瀏覽

鐵人賽自我挑戰組 DAY 18

30天深入淺出Redux 系列第 18 篇

技術 Redux 深入淺出 - [ Day 18 ] React Redux 簡介

在整進 React 專案之前我們必須了解一件事，Redux 是可以單獨獨立運作的，這也是我們之前所做的兩個 project 驗證的結果，大家應該都不陌生，兩個...

LucianoLee ‧ 2022-09-29

0 Like 0 留言 1596 瀏覽

鐵人賽自我挑戰組 DAY 17

30天深入淺出Redux 系列第 17 篇

技術 Redux 深入淺出 - [ Day 17 ] Redux Toolkit asyncThunk 非同步範例

還記得我們在原本 Redux 環境下是如何處理非同步的事件嗎？我們透過 redux-thunk 的套件來處理非同步的動作，那麼作為一個官方首推的套件裡，必然也...

LucianoLee ‧ 2022-09-28

0 Like 0 留言 962 瀏覽

鐵人賽自我挑戰組 DAY 16

30天深入淺出Redux 系列第 16 篇

技術 Redux 深入淺出 - [ Day 16 ] Redux Toolkit ExtraReducer 整理蛋糕

前篇我們整併了咖啡豆的商品，今天我們來完成最後一項蛋糕的商品，那麼相信大家也不陌生了吧！我們就一樣先把不相關的指令給碼掉，於 ./index.js 做以下處...

LucianoLee ‧ 2022-09-27

0 Like 0 留言 1215 瀏覽

鐵人賽自我挑戰組 DAY 15

30天深入淺出Redux 系列第 15 篇

技術 Redux 深入淺出 - [ Day 15 ] Redux Toolkit ExtraReducer 整理咖啡豆

前一篇我們了解了 extraReducer 的用法，並完成了咖啡商品的 slice 和 assetsSlice 裏面設定 extraReducer 綁定 cof...

LucianoLee ‧ 2022-09-26

0 Like 0 留言 2359 瀏覽

鐵人賽自我挑戰組 DAY 14

30天深入淺出Redux 系列第 14 篇

技術 Redux 深入淺出 - [ Day 14 ] Redux Toolkit ExtraReducer

前一篇我們已經完成整併了我們的每項商品，但是資金的部分我們還沒處理，像原本 redux 的做法就是靠 action type 來做標記，相同標記取不同值做不同操...

LucianoLee ‧ 2022-09-25

0 Like 0 留言 1676 瀏覽

鐵人賽自我挑戰組 DAY 13

30天深入淺出Redux 系列第 13 篇

技術 Redux 深入淺出 - [ Day 13 ] Redux Toolkit Slice

前一篇我們有介紹了 Redux toolkit 並且示範他是如何簡化及整併原本的專案的，那麼今天我們就陸續將其他兩項商品也搬移進現在的專案裡面吧！在成功的移植...

LucianoLee ‧ 2022-09-24

0 Like 0 留言 1790 瀏覽

鐵人賽自我挑戰組 DAY 12

30天深入淺出Redux 系列第 12 篇

技術 Redux 深入淺出 - [ Day 12 ] Redux Toolkit 簡介

什麼是 Redux toolkit ? Redux Toolkit 官方的推薦使用的Redux工具，用於提高 Redux 開發。它包含幾個實用功能，可簡化最...

LucianoLee ‧ 2022-09-23

0 Like 0 留言 1296 瀏覽

鐵人賽自我挑戰組 DAY 11

30天深入淺出Redux 系列第 11 篇

技術 Redux 深入淺出 - [ Day 11 ] Redux-thunk 非同步 Action

上篇我們已經完成基本的redux-thunk的安裝，那麼今天我們就來設定一組簡單的資料呈現功能吧！這邊為了示範常用的作法我會採用 axios 來做資料的串接，...

LucianoLee ‧ 2022-09-22

0 Like 0 留言 1290 瀏覽

鐵人賽自我挑戰組 DAY 10

30天深入淺出Redux 系列第 10 篇

技術 Redux 深入淺出 - [ Day 10 ] Redux-thunk 簡介

這篇分享的主要還是以非同步的處理為主，重點會擺在 redux-thunk 的使用上，當然 redux 不是只有 redux-thunk 可以處理非同步的動作。...

LucianoLee ‧ 2022-09-21

0 Like 0 留言 1139 瀏覽

鐵人賽自我挑戰組 DAY 9

30天深入淺出Redux 系列第 9 篇

技術 Redux 深入淺出 - [ Day 9 ] Reducer 的拆分

回首我們目前的功能已經相對完善許多，但站在維護的角度，我們應該可以做得更好一些！程式語言畢竟還是語言，既然是語言，我們能做的就是讓其更加言之有物，這樣也比較方...

LucianoLee ‧ 2022-09-20

0 Like 0 留言 1237 瀏覽

鐵人賽自我挑戰組 DAY 8

30天深入淺出Redux 系列第 8 篇

技術 Redux 深入淺出 - [ Day 8 ] 範例商品 - 蛋糕

今天要完成的功能為我們預設的第三樣商品蛋糕部分的購買與補貨，邏輯會和前一篇有點類似，目的也是讓大家熟悉一下 redux 資料更新的流程，那麼我們開始吧！一樣我...

LucianoLee ‧ 2022-09-19

0 Like 0 留言 1519 瀏覽

鐵人賽自我挑戰組 DAY 7

30天深入淺出Redux 系列第 7 篇

技術 Redux 深入淺出 - [ Day 7 ] 範例商品 - 咖啡豆

前一篇我們完成了咖啡的進貨功能，今天我們來延伸咖啡豆商品的部分，我們一樣先不複雜購買動作的複雜性，讓我們再走一次流程加深印象。首先，先定義出 action t...

LucianoLee ‧ 2022-09-18