State Management with React Query

Solve some of the most common challenges related to data fetching and data mutations while learning one of the most popular libraries for managing server state in React

Key Features

• Learn how state splits into server and UI states and the common challenges associated with them
• Understand how React Query helps with data fetching and mutations to solve server state challenges
• Apply the knowledge gained to improve developer experience and build applications with better UX

Book Description

State management is one of the hottest topics in the React ecosystem. There are many libraries and tools to handle state in React, and with each comes different recipes and opinions. One thing is clear though: state management solutions for handling client state are not so good at dealing with server state. React Query was created as your solution to help manage your server state!

State Management with React Query will serve as your guide, taking you from zero to hero with React Query.

You'll begin to understand the historical background of state in the React world and what led to the need to split from a global state to UI and server state. With this knowledge, you will understand the need for React Query, and as you advance through the chapters, you'll understand how React Query helps you deal with common server state challenges like fetching data, caching data, updating, and synchronizing your data with the server. But this is not all, once you've mastered React Query, you will be able to apply this knowledge to implement server side rendering.

Finally, you will learn some patterns to test your code by leveraging the Testing Library and Mock Service Worker.

By the end of this book, you'll have a new perspective of state and be able to leverage React Query to solve the challenges associated with server state.

What you will learn

• Learn about state and how it's often managed
• Discover how state splits into server state and UI state
• Solve common challenges with server state using React Query
• Install and configure React Query and its Devtools
• Manage server state data fetching by using the useQuery hook
• Create, update and delete data by using the useMutation hook
• Discover the use of React Query with frameworks like Next.js and Remix
• Explore MSW and the Testing Library to test React Query using hooks

Who This Book Is For

JavaScript and React developers who want to improve their state management skills and overcome the challenges brought about by server state while improving their developer and user experience. Basic knowledge of web development and React will help in understanding some of the key concepts covered in this book.

Table of Contents

1. What Is State and How Do We Manage It?
2. Server State vs UI State
3. Getting Started with React Query
4. Fetching Data with React Query
5. More Data Fetching Challenges
6. Performing Data Mutations with React Query
7. Server Side Rendering with Next.js or Remix
8. Testing React Query Hooks and Components