Contents
通過測試驅動開發改進你的程式碼
從這 15 小時的課程,你會學到
- 使用 Jest 和 Enzyme 編寫 React 和 Redux 的單元和整合測試。
- 了解不同測試方法的權衡點以及何時選擇哪種方法。
- 通過測試驅動開發更有效地規劃你的 React 應用程式。
- 模擬方法和模組,使你的測試保持隔離。
要求
- 熟悉 JavaScript 和 React / Redux(Redux 是選擇性的,僅在課程的後半部分使用)
課程說明
通過學習使用 Jest 和 Enzyme 進行測試驅動開發,將你的 React 程式碼提升到新的水平! Jest是一個功能強大、靈活的測試框架,Enzyme 為提供測試 React 和 Redux 應用程式的工具。 在本課程中,你將學習如何測試:
- React Hooks,包括 useEffect、useState 和 useReducer
- 使用 Axios 的非同步函式
- Redux 動作建立器和還原器
- 使用 Redux Thunk 的複雜 Redux 動作建立器
- React context,包括具有嵌入式狀態的 context
你還將學習如何充分利用 Jest 的功能,包括
- Mock 和恢復模組的個別屬性
- Mock 整個模組
- 控制哪些測試使用.skip和.only執行
- 使用.each在不同的資料下多次執行測試套件
請注意:本課程不包括 Jest snapshots,因為它們與測試的TDD模式不相容。
為什麼要學習測試?
測試驅動開發將幫助你編寫更易於維護的、更好的、有組織程式碼,這將為你節省時間。 你的測試為你的軟體開發團隊提供了價值,因為其他人知道他們可以信任你所出品的程式碼。 雇主期望聘請的開發人員具備測試技能!
了解語法背後的原因
本課程討論在考慮不同測試方法時的權衡點,讓你對所做的測試選擇充滿信心。 此外,當我們深入了解每一方面如何和為什麼測試時,你將加深對 React 和 Redux 的理解。
練習你的新技能
你也將有機會練習你所學到的東西。 在我們建構課程專案時,偶爾會有“測驗”,你可以在其中應用所學內容,然後觀看視訊以查看解決方案。 你還會接受兩套擴展課程專案的挑戰,其解決資訊都放在 GitHub 上供你參考。
為什麼我目前推薦 React 測試庫
React Testing Library 和 Enzyme 做同樣的工作:渲染組件,以便它們可以用 Jest 進行測試。 我推薦 React Testing Library 而不是 Enzyme,原因如下:
- 與 Enzyme 不同,React 測試庫不依賴於 React 內部結構。 這意味著 React 測試庫沒有需要隨 React 的每個版本更新的適配器,並且在新的 React 版本中出現問題的可能性要小得多。
- 我發現 React Testing Library 比 Enzyme 更容易使用。
這對本課程意味著什麼
現在 React 18 已經出來了,看不到 React 17 適配器,我不相信 Enzyme 有未來。 對於希望學習如何測試新的 React 應用程式的人,我不會推薦這門課程。 相反,我建議你找一門關於 React Testing Library 的課程。
也就是說,每週仍有約 240 萬次 Enzyme 下載(截至 2022 年 4 月)。 以下是我推薦學習 Enzyme 的情況:
- 你正在處理一個已經有大量 Enzyme 測試的遺留專案,並且該專案從未打算升級到 React 18。
- 你正在處理一個包含大量現有 Enzyme 測試的專案,並且你希望在遷移到 React 測試程式庫 (React Testing Library,RTL) 之前了解這些測試。 然而,React 17 非官方 Enzyme 適配器的作者 Wojciech Maj 建議: “雖然從 Enzyme 支持文章可讓你做遷移,但我建議你重新開始,忘記 Enzyme 曾經存在過。 RTL 絕不是 Enzyme 的直接替代品,因此擁有全新的思維方式將幫助你充分利用它。”
底線
當這門課程問世時,Enzyme 是測試 React 應用程式的好方法; 但是,我不能再推薦它了。 我鼓勵你改為學習 React 測試程式庫( RTL )。
目標受眾
- 有興趣通過測試來改進 React 應用程式的程式設計師
講師簡介
Bonnie Schulkin 教師 | 程式設計師 | 平庸的貝斯手
我的教學生涯始於當我小時候與我(不太願意)弟弟上學的時候。 我逐漸將自己的視野擴展到比較願意學習的高中學生,並且最近在各種新手訓練營教授軟體開發給高興學習的成年人。 自 90 年代中期以來,我一直在軟體行業工作,這在舊金山科技界許多程式設計師的誕生之前就已經開始。
英文字幕:有
- 想要了解如何將英文字幕自動翻譯成中文? 請參考這篇 How-To
- 點選這個✨優惠連結( 特價 NT370 起)✨ 非 IT 認證的課程用 NT390 起的優惠連結 可能拿到更好的價格喔, 試試看! | Udemy 永久擁有課程 ( 在電腦瀏覽器登入,點選“優惠連結”後再回想要的課程介紹中點選“報名參加課程”即可取得 )
- Udemy 現在越來越多課程有中文字幕,請參考 Soft & Share 中文線上課程
- 手機上點選優惠連結看到的價格比電腦上看到的貴
- $代表當地貨幣, 如在台灣為 NT
- 點選”報名參加課程”有可能因瀏覽器 cookies 轉久一點或回報錯誤而無法連上,請稍等刷新或重新點選就會出現
報名參加課程

也許你會有興趣
- 最新的 React 新手訓練營(Hooks,Context,NextJS,Router)
- React 前端開發學習地圖
- ★英語學習地圖 – 練好英文是最大的學習槓桿
- 如何找工作學習地圖 – 找工作不要靠運氣!
- 從 Soft & Share 各種社團頻道挑選你喜歡的加入
發表迴響