Why I Use RTK Query for API Calls in React

The <a href="https://redux.js.org/tutorials/essentials/part-7-rtk-query-basics" rel="noopener ugc nofollow" target="_blank">RTK Query part</a> of the Redux Essentials tutorial is phenomenal, but since it’s part of a much larger suite of documentation, I feel like the gem that is RTK Query is getting lost. <img alt="A pink ball of energy with lavendar electricity beaming all over the place." src="https://miro.medium.com/v2/resize:fit:630/1*dWTT-G7jmLFAihbwjYimqw.jpeg" style="height:467px; width:700px" /> Photo by <a href="https://unsplash.com/@halacious?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText" rel="noopener ugc nofollow" target="_blank">Hal Gatewood</a> on <a href="https://unsplash.com/photos/OgvqXGL7XO4?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText" rel="noopener ugc nofollow" target="_blank">Unsplash</a> <h1>What is Redux</h1> A lot of people think of Redux as a state management library, which it is. To them, the main value of Redux is that it makes it possible to access (and change) the application state from anywhere in the application. To me, this misses the point of using something like Redux, so let’s zoom out a bit and take another look. We’ve all seen this diagram, or something like it: <img alt="Animation of action being dispatched from the UI with a payload that updates the store, which in turn updates the UI with the new state." src="https://miro.medium.com/v2/resize:fit:630/1*yYkitaR24SuFNXYyTxL1xA.gif" style="height:525px; width:700px" /> Source: <a href="https://redux-toolkit.js.org/rtk-query/overview" rel="noopener ugc nofollow" target="_blank">Redux Fundamentals</a> tutorial. You can see that, in this model, the UI has a place to display the current amount from the store, and buttons that the user can click to indicate she wants to deposit or withdraw money. As soon as one of those buttons is clicked, we move outside of the component to dispatch the action based on what the user has requested. Note that at this point, the state has not changed. Next, the action arrives at the store, and the reducer looks at it to decide what, if anything, to do about the user’s request. If the reducer decides to honor the user's request, that change in state will then be propagated to the UI. <a href="https://medium.com/codex/why-i-use-rtk-query-for-api-calls-in-react-fee9e2a4538">Visit Now</a>