How to Use Async/Await with Axios in React

The best way to retrieve data using async/await

Hello! I am a front end developer at Morfsys and I enjoy writing about things related to web, technology and more. In this piece, I’ll be covering how to best use async/await with Axios in React.

Installing Axios

First thing first, to get started, we’ll need to install Axios:

npm install --save axios

Making a Get Request

Next, let’s try to make a simple get request using Axios from our react component:

The above code makes a get request to https://reqres.in to retrieve a few users from their API and displays the user’s first name in our component.

Using Async/Await

Now, we want to make the same request using async/await.

Let's do it!

For a function to use await, we must wrap the function itself as an async function: