iT邦幫忙

鐵人檔案

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

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

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

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

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

Day 1 - 為什麼要當Clean Coder跟寫測試

身為一位軟體工程師應該蠻常會遇到一件事,就是需要靠通靈才能知道這支程式到底在說什麼,如果今天有個靈媒證照,那或許我們都可以去試試看,當作副業創造金流好像也不錯(...

2023-09-02 ‧ 由 Dylan 分享
DAY 2

Day 2 - Clean Code 介紹 & 命名(Naming)

「Clean Code 是可被原作者以外的開發者閱讀與增強的。它應當包含單元測試與驗收測試 「減少重複、具有高度的表達力、並及早建立簡單抽象概念,這些對我而...

2023-09-03 ‧ 由 Dylan 分享
DAY 3

Day 3 - 註解 (Comments) & 編排(Formatting)

註解無法彌補糟糕的程式碼 Uncle Bob:「寫註解的其中一個動機,是因為程式碼寫的太糟糕」 如果真的遇到糟糕的程式碼,且不是在非常緊急的狀況下,請好好的把裡...

2023-09-04 ‧ 由 Dylan 分享
DAY 4

Day 4 - 函式 (Function) part 1

「關於函式的首要準則,就是要簡短。第二項準則,就是要比第一項的簡短函式還要更簡短。這是一個我無法證明的主張」。作者提到的這句話我深感認同,函式就是要跟uber...

2023-09-05 ‧ 由 Dylan 分享
DAY 5

Day 5 - 函式 (Function) part 2

今天就延續 part 1 沒有補到的一些小觀念 封裝狀態(Encapsulate Conditionals) 將狀態的判斷用另外一個function獨立處理 i...

2023-09-06 ‧ 由 Dylan 分享
DAY 6

Day 6 - 錯誤處理 (Error Handling) & 測試 (Testing)

例外事件(Exceptions) 不在人類面前出現的哥布林才是好哥布林,但有拋出錯誤的bug才是好bug。與其透過一個一個的印 log ,不如在一開始覺得有可能...

2023-09-07 ‧ 由 Dylan 分享
DAY 7

Day 7 - 專案建置 & Jest環境設定

建立專案 建立專案方式我使用 vite + React ts npm create vite@latest 測試框架 :Jest Jest 是前端測試框架的一...

2023-09-08 ‧ 由 Dylan 分享
DAY 8

Day 8 - 什麼時候該寫單元測試 & Jest 語法

我們什麼時候該做單元測試 以TDD開發的話,那你應該會在寫任何一個function的時候就先把測試寫下來 商業邏輯複雜時 多人開發時 會因為狀態改變而呈現不同...

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

Day 9 - React Hooks 測試 part 1

今天我們來玩玩 hook 的測試吧,今天會用到的API有 renderHook : 生成一個測試用的 TestComponent 並會返回三個參數 re...

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

Day 10 - React Hooks 測試 part 2

AJAX 相關 這邊寫了一個蠻常用的 hook 種類 useFetchUsers() import axios from 'axios'; import {...

2023-09-11 ‧ 由 Dylan 分享