HTTP Requests with Axios – Practical Guide with Examples

Axios is a popular JavaScript library that simplifies the process of sending and handling HTTP requests in both frontend and backend applications. It provides a user-friendly interface and a plethora of features that make working with APIs a breeze. In this blog, we’ll explore the power of Axios with practical examples, demonstrating how to perform GET, POST, PUT, and DELETE requests.

Getting Started:

Before diving into examples, let’s quickly set up Axios in your project. Axios can be used in both browser-based and Node.js environments. To include Axios in your project, you can use either a package manager like npm or yarn:

npm install axios
# or
yarn add axios

Once Axios is installed, you can import it into your JavaScript file or module:

// For CommonJS (Node.js) environment
const axios = require('axios');

// For ES6 (browser-based) environment
import axios from 'axios';

Example 1: Performing a GET Request

In this example, let’s make a simple GET request to an imaginary API that returns a list of users.

// GET request using Axios
.then((response) => {
// Handle the success response
.catch((error) => {
// Handle the error response
console.error('Error fetching data:', error);

Example 2: Performing a POST Request

Now, let’s demonstrate how to perform a POST request to create a new user on the server.

const newUser = {
name: 'John Doe',
email: '[email protected]',
};'', newUser)
.then((response) => {
console.log('User created:',;
.catch((error) => {
console.error('Error creating user:', error);

Example 3: Performing a PUT Request

Let’s update an existing user’s data using a PUT request.

const updatedUser = {
name: 'Jane Smith',
email: '[email protected]',

axios.put('', updatedUser)
.then((response) => {
console.log('User updated:',;
.catch((error) => {
console.error('Error updating user:', error);

Example 4: Performing a DELETE Request

Lastly, let’s delete a user using a DELETE request.

const userIdToDelete = 1;

.then((response) => {
console.log('User deleted:',;
.catch((error) => {
console.error('Error deleting user:', error);



Leave a Reply