React Query Tutorial for Beginners

React Query is a library for fetching data in a React application. Since React is a UI library, there is no specific pattern for data fetching. What we typically do is make use of useEffect hook for data fetching and useState hook to maintain component state like loading, error or resulting data. If the data is needed throughout the app, we tend to use state management libraries. But what is important to note here is that most of the state management libraries are good for working with client state. State like theme for the application or whether a modal is open. They are not great for working with asynchronous or server state. This is because server state is very different to client state. Client state is persisted in your app memory and accessing or updating it is synchronous. Server state on the other hand is persisted remotely, in a database perhaps and requires asynchronous APIs for fetching or updating. Also, server state unlike client state has shared ownership. Data can be updated by someone else without your knowledge which can quickly lead to UI data that is not in sync with the remote data. It becomes even more challenging when you have to deal with caching, deduping mu