karasune
Portfolio
Blog

©2021 Kara Sune

Why I Switched from Axios to React Query for Data Fetching

Kara Sune - January 29, 2024

React Querycaching

+4

When at first I started building React apps back in then, Axios was the first tool I used for handling API requests. It made things easy, just send a request, get the response, and you’re done. But as my apps got bigger, I realized that fetching data wasn’t the hard part.


The real challenge was managing state, handling errors, and deciding when to refetch data. I found myself writing the same logic over and over again. That’s when I discovered React Query, and everything changed.


With Axios, I always had to set up loading and error states manually and this works, but it’s repetitive. Every time I made a request, I had to write this same pattern.


But with React Query, less stress, less boilerplate.


React Query takes care of the loading, error, and success states automatically and even to beyond of what you are expecting.


One thing I struggled with was caching. Let’s say I load a list of courses. If I navigate to another page and come back, Axios would fetch the data again, even if nothing changed.


React Query fixes this. It caches the data, so if I return to the page, the cached data shows up instantly while it quietly checks for updates in the background. This makes the app feel much faster, and I didn’t have to write any extra code to make it happen.


Other Tools You Might Want to Check Out


While React Query and Axios are great, there are other libraries worth exploring, depending on your project needs as well.


  • SWR: Built by the creators of Next.js, it’s a lightweight library for data fetching with automatic caching and revalidation, similar to React Query.

  • TanStack Query (formerly React Query): If you're using other frameworks like Vue or Solid, TanStack Query works outside React too.

  • Apollo Client: Perfect for working with GraphQL APIs. It handles state management, caching, and real-time updates.

  • RTK Query: Comes with Redux Toolkit, making it a good choice if your app already uses Redux for state management.

  • Fetch API: If your needs are simple, the native Fetch API in JavaScript might be enough, especially when combined with libraries like useSWR.

Each tool right here has its strengths, so it’s worth experimenting to see what works best for your stack. For me, React Query feels like a game-changer, but exploring different options helped me understand what I really needed, so i believe you will want to check it out. Try them out, and you might find the perfect fit for your next project!


The main reason I switched to React Query is simple. It saves me time and reduces the amount of code I need to write. I can focus on building features instead of constantly worrying about how to manage API requests. I still use Axios for the actual requests because it’s great at that. But wrapping it in React Query makes my life so much easier.


If you’re still handling API calls manually, give React Query a try.


It might feel a bit different at first, but once you see how much it simplifies things, you’ll probably never want to go back.


Thanks for reading.

Continue exploring with these related posts

No One is All Knowing

No One is All Knowing

We are meant to be in motion. We are meant to begin as beginners again and again across different parts of life. The goal isn’t to become all knowing but becoming more open, more curious, more willing to learn than you were yesterday.

ConsistencyLearning

+3

Too Many New Things Will Distract You From Your End Goals

Too Many New Things Will Distract You From Your End Goals

A long, practical reflection for developers, designers, cybersecurity engineers, and everyone in tech on why chasing every new tool or framework can slow you down, and why deep, focused learning matters more.

FocusTech Career

+3

Learn With a Project That You Actually Want

Learn With a Project That You Actually Want

Learning sticks best when it is tied to something you genuinely care about. Instead of forcing yourself through random tutorials, pick a project you actually want to exist. Real interest drives focus, reveals knowledge gaps, builds confidence, and turns motivation into a natural side effect of creating something meaningful.

learning-by-buildingconfidence

+4

Using Tools to Help You Isn't a Bad Thing

Using Tools to Help You Isn't a Bad Thing

Tools are not shortcuts, they’re accelerators. Learn why using tools as a developer doesn’t make you less skilled but more efficient, and explore over 20 popular tools that help developers build smarter, faster, and better.

Developer ToolsAutomation

+6