React-query (2020 Feb. release)の登場により最新のReact開発では、REST APIから取得したServerデータの状態管理とアプリケーション(Client)の状態管理を分離する手法が主流になりました。本コースでは、最新のBest practiceに沿ってreact-queryのキャッシュ機構を使ったサーバーデータの状態管理手法とRedux toolkitを使ったアプリケーション(Client)の状態管理について学習していきます。また、サーバーへのfetch回数の低減と不要な再レンダリングの抑制を中心に最適化技術について学習します。
Server state data management —> react-query
Client state management —> redux(redux toolkit)
-
react-queryを使ったサーバーデータのcache管理
-
Redux toolkitを使ったアプリケーションの状態管理(Client)
-
useContextとRedux toolkitの再レンダリング性能の比較
-
useQuery+useMutationを使ったCRUD処理(REST API連携)
-
react-queryと従来のfetch処理の比較
-
staleTimeとcacheTimeの理解
-
custom hook + memo
-
react-query dev tools + redux dev tools
-
Todoアプリ実践 (REST API連携)