iT邦幫忙

鐵人檔案

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

React Clean Code And Unit Tests - 利用測試寫出人類看得懂的React程式 系列

任何白痴都能寫出電腦看得懂的程式。好的程式設計師則會寫出人類看得懂的程式。
透過Clean Code的觀念跟測試寫出所有人都能維護的程式碼

希望透過這次挑戰精進自己跟讀者們寫程式的功力~

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

Day 11 - React Testing Library 元素選取

Render Component render() : 用於在測試環境中渲染組件 screen() : 可以更簡單地訪問渲染的組件內容。 screen.deb...

2023-09-12 ‧ 由 Dylan 分享
DAY 12

Day 12 - Component 測試

Component 測試 今天來綜合一下前面寫的測試吧,利用useFetchUsers()拿到的資料更新 component ,再判斷顯示是否正確。我們稍微改寫...

2023-09-13 ‧ 由 Dylan 分享
DAY 13

Day 13 - Redux Toolkit 測試

Redux Toolkit 為了測試,我們把預設的專案改成使用 redux 的形式吧~安裝 redux toolkit npm install @reduxjs...

2023-09-14 ‧ 由 Dylan 分享
DAY 14

Day 14 - userEvent 模擬使用者操作

user-event 透過 userEvent 可以更好的去模擬 user 的行為 常用的會有 click type keyboard hover selec...

2023-09-15 ‧ 由 Dylan 分享
DAY 15

Day 15 - 關於 testing scoping 與狀態清除

突然想到好像沒有介紹到 Scoping 這部分,今天就稍微簡單帶過一下吧~ Scoping 跟 function 一樣 ,有全域的部分及區域的部分,所以有可能會...

2023-09-16 ‧ 由 Dylan 分享
DAY 16

Day 16 - 3A Pattern & TDD part 1

3A Pattern (Arrange Act Assert) 補充一下前面沒提過的 3A Pattern Arrange:初始化測試的對象 Act:執行...

2023-09-17 ‧ 由 Dylan 分享
DAY 17

Day 17 - TDD part 2 : Functional Programing

Functional Programing 我自己並不覺得 FP 跟 OOP 有優劣之分,只要邏輯簡單易懂,都是很好的做法 。 我在學習 TDD 開發的過程中,...

2023-09-18 ‧ 由 Dylan 分享
DAY 18

Day 18 - 那些可以試著用在專案的 Functional Programing 觀念 part 1

這兩天來看看 function programing 的哪些概念可以幫助我們寫出 clean code 吧 ! First-class Function 一級函...

2023-09-19 ‧ 由 Dylan 分享
DAY 19

Day 19 - 可以試著用在專案的 Functional Programing 觀念 part 2

Immutability 當我們說一個物件是 Immutable ,那就表示這個物件在被產生之後,就無法再被修改了,在JS中如果你是用 const 宣告的就代表...

2023-09-20 ‧ 由 Dylan 分享
DAY 20

Day 20 - React Compound Component Pattern

什麼是Compound Component? 我們來看一下,React 最一開始教大家用 props 寫共用 component 的方法 // with pr...

2023-09-21 ‧ 由 Dylan 分享