今天要來學習的 Reducer 的應用，主要內容為 Reducer 的操作步驟。 較複雜的事件處理器 隨著程式越來越複雜，我們可能會遇到下面這樣的情況 像是在...
React Native 的架構演進 在 React Native 的早期版本中，資料在JavaScript和原生層之間的通訊是透過Bridge來進行。但由於需...
今天應該會完成大致上的呈現～ Step1 修正 App.tsx // App.tsx import React, { useState } from 'rea...
叮叮
‧
2023-10-11
昨天介紹了 client component，今天要介紹 next 13 推出的新功能: server component。server component 可...
時雨
‧
2023-09-22
前言 今天我們接續前一篇的案例，再來講講一些NG的案例，總是會有一些講不聽不想拆 component 的人，在新版本的環境下應該會被強制修改，因為如果不改的話會...
Day-23 專案演練 - 狀態管理員 redux 近半年前的我剛碰到 redux 的時候，卡關卡很久，看 RTK 的官方教學看不懂，就在網上找到了原作者的教...
今天讀完了 React 官方文件的 Synchronizing with Effects 的章節，初步學習了 Effects 的相關知識，透過實作來練習和理解觀...
今天要來接紹一個還在實驗性的hook，只有在實驗性和canary的版本才有支援。 這個hook的功能是用來讀取資源的值，這邊的資源可以是Promise和con...
第十二天囉～ 當更新畫面 我們必須觸發 React 的更新流程， 這樣最新的資料才會顯示在畫面上， 而這樣的流程，就包含在了 React 的 component...
阿毛
‧
2021-09-27
在完成兒童任務管理平台的核心功能後，我又在 AI 的協作下，快速打造了「每週報告」：彙整任務完成率、活動紀錄與獎勵兌換等等；接著，我又想到的一個適合的常見功能&...
tags: ItIron2023 react 前言 我們昨天看了一個有趣的useState問題，了解到initialValue的一些限制，今天我們會再看一個與s...
大家好，今天是我們 React 學習的第十二天，想和大家聊聊如何為 React 應用程式撰寫測試。其實，寫測試沒有想像中困難，反而能讓你的程式碼更穩定可靠。 為...
這篇文章的主要內容 簡單介紹 useRef hook 的使用方法 useRef useRef 是 react 裡面除了 useState 以外另外一個用來儲存...
今天要來學習state的應用，內容包含： 認識state 操作方法 stateHook 什麼是state? 如何理解 state，字面上的意思就是當前的程式...
以為「當滑鼠移動到 Toast 元件上時要暫停倒數」會很複雜，實際上的解決方式卻異常簡單。 成品 原始碼展示 開發思路 倒數進度條 首先透過 props.cou...
終於進到實作環節啦——之前在Codrops曾看到用React Three Fiber做出酷炫3D效果的案例，就想說一定要趁著鐵人賽嘗試。 這次參考的程式碼中出現...
這段時間因為投入 iThome 鐵人賽文章的撰寫，平台的更新暫時停了下來。 為了避免思路斷掉，我決定在網站上增加一個「開發日誌」頁面，專門記錄平台的開發過程與背...
在 Day 6，我們開始建立第一個 React 元件，並透過 props 將父層元件的資料傳遞給子層元件。隨後，我們學習了 useState，了解了如何在元件...
鯨魚
‧
2024-09-26
Day-18 專案演練 - 重構程式碼 雖然並沒有影響專案的功能、畫面，但隨著 TodoPage 的篇幅越來越長，我感覺在撰寫程式的過程有點不太舒服，所以我打...
今天會繼續延續昨天的內容，說明 React 中所指的 side effect 是什麼，常見的 side effect 又有那些
使用vite安裝環境 在terminal終端機輸入npm create vite@latest安裝後依照指令自行取名(這裡取名sample)後選擇react j...
倒數第4天的挑戰，是完成一套新增讀取編輯刪除(CRUD)的頁面組裝與串接，話不多說直接開始！ 組裝列表頁面(店家視角) 串接讀取文件的 API import...
爬文時常看見「虛擬DOM」一詞，但還沒有梳理過，特於此筆記。 Takeaway 虛擬DOM其實是JS物件 Vue也有虛擬DOM，叫作VNode Svelte的...
延續上一篇，今天繼續研究 Firestore Database 的資料操作， 溫馨提醒：以下內容看到的 showNotify 是我個人封裝使用的提示彈窗，並不...
今天要來製作購物清單，透過這個練習我們可以複習 Lifting State Up 的觀念。先來看目前的程式碼： App.js import React fr...
昨天快速介紹過react，今天直接進入實作 大綱 建立專案並安裝React 安裝開發用到的套件 1.建立專案並安裝React 在要新增專案的地方輸入以下指令...
今天這兩個頁面比較單純的只是呼叫API去取得當前的資料，並顯示於頁面上。 大綱 文章列表頁開發 標籤頁開發 路由設定 1.文章列表頁開發 Wireframe...
今天的重點摘錄 元件像人一樣有生有死，而生命週期幫助我們能在「特定階段」，做「只有該階段會做的事情」 constructor ：初始化與建構物件 render...
今天，我們要來實作一個報表和分析功能，讓健身房老闆可以一目了然地看到整個健身房的運營狀況。 1. 安裝必要的套件 首先，我們需要安裝 Recharts，這是一個...
有了主畫面後，我習慣先從主功能將 Wireframe 線稿依照原先的 Flow Chart 畫出來，細節功能會陸續繪製(有先想到的會以 Todo 標示)，並於後...
yuu
Felix阿甫
LucianoLee
aoigj100
ss95159
平凡工程師
windate3411
Moscle.dev
evan_hsu
查理狐狐
haruowang
pjchender
Annie
Yihsuan
我是圈圈
iThome鐵人賽
看影片追技術