iT邦幫忙

鐵人檔案

第 11 屆 iThome 鐵人賽
回列表
Modern Web

在 React 生態圈內打滾的一年 feat. TypeScript 系列

在「一步一腳印」學會 React 後,只是另一個起點的開始。

去年鐵人賽用力學會 React 的同時,也換了一份前端工作,學會了然後呢?

本系列會重新闡述及分享這一年內在 React 生態圈內所學及使用的框架,不論是不懂 React 的新手也好,初學者、正在以 React 開發的工程師、高手們,都可以享受在本系列的文章中,並更了解 React 。

除了以同主題再戰 React 外,也另外收錄了與 TypeScript 的使用方法及開發方式,相信不會讓大家失望!

文章間的學習曲線會控制的平穩,讓大家以輕鬆的心情每天花個五至十分鐘閱讀 : )

鐵人鍊成 | 共 31 篇文章 | 172 人訂閱 訂閱系列文 RSS系列文 團隊IT成長團
DAY 11

Day10 | Props 太多, Component 就容易出錯, 就讓 Prop-Types 替你把關吧!

前言 不曉得大家還記不記得這個畫面: 對的,這是在 Day06 中埋下的伏筆,因為之後的 Hooks 就會開始運用 Props!所以趁現在來解決他吧! 前置...

2019-09-22 ‧ 由 神Q超人 分享
DAY 12

Day11 | 你有傳送門,我有 useContext!

前言 useContext 是能夠讓程式變得簡潔的利器,Component 不再需要經過一層一層的 Props 傳遞,便能直接使用在需要它的 Component...

2019-09-23 ‧ 由 神Q超人 分享
DAY 13

Day12 | React 的快樂小夥伴 - Redux 資料管理篇

前言 Redux 是一個全域的資料管理工具,更簡單來說, 就是能替你管理整個網站需要的 State, 所有的資料都能放在 Redux,需要資料的 Compone...

2019-09-24 ‧ 由 神Q超人 分享
DAY 14

Day13 | React 的快樂小夥伴 - Redux 事件處理篇

前言 在上一篇的資料處理篇中,我們學習到了如何將資料放到 Store 中儲存,並以 useSelector 將資料取出,而本篇會提及如何使用 Reducer 異...

2019-09-25 ‧ 由 神Q超人 分享
DAY 15

Day14 | Redux 的改變,Logger 看得見

前言 前兩篇學習了 Redux 的操作方法,雖然 Redux 替我們處理資料真的很方便,但是實際上是得經過 Component、Action、Reducer 三...

2019-09-26 ‧ 由 神Q超人 分享
DAY 16

Day15 | React-Saga 見一次就愛上的 async flows

前言 在 Redux 中做非同步的請求其實是很麻煩的,這也是一開始讓我卡關的一個痛點,但好在有 StackOverflow 才沒讓這個痛持續很久。 其實一開始我...

2019-09-27 ‧ 由 神Q超人 分享
DAY 17

Day16 | SPA 的換頁不是你的換頁

前言 今天要和大家介紹的是 SPA, 是一種提升用戶在瀏覽網頁時的技術, 傳統式的網頁在切換頁面時,都會送出一個 Url 給服務器,之後服務器會依它收到的 Ur...

2019-09-28 ‧ 由 神Q超人 分享
DAY 18

Day17 | 不知道對不對,就把邏輯通通測起來 feat. Jest

前言 單元測試是個很神奇的技能,筆者一開始是為了重構而學的,那時候單純的以為寫下測試只是方便讓邏輯不被改變,但是沒想到它帶來的好處比想像中的還多,因為在為程式寫...

2019-09-29 ‧ 由 神Q超人 分享
DAY 19

Day18 | 用 Mock 打造國家機器,驗證函式執行 feat. jest

前言 本篇會提及的 Mock 在 Unit Test 中扮演著很重要的角色,因為單元測試必須將關注點放在要被測試的 function 身上,不能讓不確定性在 f...

2019-09-30 ‧ 由 神Q超人 分享
DAY 20

Day19 | Component 的測試方式不私藏

前言 今天要進入如何對 Component 做測試,這裡筆者之前是使用 Enzyme ,可能也是主流的 React 的測試框架,但是學測試的時候 React 剛...

2019-10-01 ‧ 由 神Q超人 分享