Axios

How to use Axios

Axios is a popular promise-based HTTP client that can be used in both the browser and node.js. It provides an easy-to-use API for making HTTP requests to servers and handling responses.

To use Axios in your project, you first need to install it using either npm or yarn. You can do this by running the following command in your terminal:

npm install axios

or

yarn add axios

Once you have installed Axios, you can import it into your code using a standard import statement:

import axios from 'axios';

With Axios imported, you can then start making HTTP requests using its API. For example, to make a GET request to a server, you can do the following:

axios.get('/api/data')
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

In the above code, we are making a GET request to

and logging the response data to the console. If there is an error, we log that to the console as well.

Axios supports all HTTP methods, including GET, POST, PUT, DELETE, and more. To make a POST request, for example, you can do something like this:

axios.post('/api/data', {
  name: 'John Doe',
  email: '[email protected]'
})
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

In this example, we are making a POST request to

with some data in the body of the request. Axios automatically sets the header to , so we can send JSON data without having to manually set the header.

Axios also allows you to set default options for all requests, such as headers or query parameters. You can do this by creating an instance of the Axios client and setting options on it:

const apiClient = axios.create({
  baseURL: 'https://api.example.com',
  headers: {
    Authorization: 'Bearer token'
  },
  params: {
    apiKey: '1234567890'
  }
});

apiClient.get('/data')
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

In this example, we are creating an instance of the Axios client with a base URL, default headers, and query parameters. We then use this client to make a GET request to

, which will automatically include the default headers and query parameters.

Overall, Axios provides a powerful and easy-to-use API for making HTTP requests in both the browser and node.js. Its promise-based approach makes it easy to handle responses and errors, and its support for default options makes it easy to configure across your application.