Axios vs Fetch

So today I wanted to talk about the advantages of Axios requests. I am in no way knocking Fetch. Where I was trained as a software engineer they taught us Fetch, and up until recently I thought that was the only way. But just like everything else in SE and coding, there is a million ways to do something. I have been taking a JavaScript course on Udemy, and he taught us Fetch first, but then moved on to async functions where he introduced us to Axios, and how they run more efficiently and faster.

To show you the difference let’s look at a normal GET request using Fetch.

function getData(){
   return fetch("someurl")
   .then((res) => res.json())
   .then((data) => console.log(data))
}

Here when we write fetch we have return it so that we get a response back from the promise. Then we have to parse it into JSON, and if you are doing any other request in the body you have to stringify the the data. Then you have to take that data in the response and do something with it. Sounds like a lot of work to always remember, and it can get a tad messy.

Now let’s look at a GET request using Axios!

axios.get("someurl")
.then((data) => console.log(data))

That’s it! What axios is doing for us behind the scenes is taking or url and then parsing it for us. So at the end of the day all we have to do is tell it what to do in the .then() and voila!

There is a lot more functionality that goes along with Axios. You can assign an async function and then use axios to get information. Then invoke that function and chain a .then() onto the function invocation. You can also tell that function to await and then do something else with the await keyword that is built into it.

I hope this was a little eye opening for you! And hopefully you get to play around with it and come to understand it. Until next time!