Blog

Why choose Axios for building a web application

Axios is a populat JS libabry that makes it easy to make web requests and access external resources. I like using Vue.js and Axios together and I can point some advantages of using them. First of all Axios supports older browsers, which allows you to build more accessible user experience. Also the library comes with build-in CSRF protection to prevent vulnerabilities. And another advantage is that you can build both front-end and back-end applications because it also works in Node.js. Axios lets you quickly configure the timeout property. The syntax is more straighforward. For instance, it uses aliases. Axios supports automatic JSON stringification when sending requests. While using for example the Fetch API, we have to do this manually.

Axios provides us with some exciting functionality to intercept both requests and responses. It allows us to intercept the request or response object before they are handled by then or catch. This functionality gives us many possibilities, such as:

  • Automatically adding headers for each request object like authorization headers
  • Transporting response errors to a monitoring tool for analysis
  • Modifying a response object to a different format

There are many popular libraries that modify the Axios source code or help you with specific tasks. For example, the axios-response-logger library helps you with various ways of logging Axios responses using interceptors. Here is a list with other useful Axios libraries:

  • vue-axios - A small wrapper for integrating Axios to Vue.js
  • axios-api-versioning - Adds easy-to-manage API versioning to Axios
  • axios-logger - Similar to axios-reponse-logger. When you send a request in nodejs, you need to show the log to the console. This library display the necessary information while communicating with the server.

In my opinion Axios has gained a lot of popularity as it’s a bit more comfortable to use than the browser’s Fetch API. Also it won't increase your total project size by much.

Image placeholder

V. Hristova

Engineer Front-end developer