Hindi में शुरुआती उपयोगकर्ताओं के लिए JavaScript Axios API ट्यूटोरियल्स!

Posted by


Axios is a popular JavaScript library that is used to make HTTP requests from browser to server. In this tutorial, we will learn how to use Axios API in JavaScript for beginners in Hindi.

Step 1: Install Axios

First, we need to install Axios in our project. We can do this by including the Axios library in our HTML file or by using a package manager like npm or yarn.

To install Axios using npm, run the following command in your terminal:

npm install axios

Step 2: Import Axios

Next, we need to import Axios in our JavaScript file. We can do this by adding the following code at the top of our file:

import axios from 'axios';

Step 3: Making a GET Request

Now that we have imported Axios, we can start making HTTP requests. Let’s start by making a GET request to a sample API. Below is an example of how to make a GET request using Axios:

axios.get('https://jsonplaceholder.typicode.com/posts')
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

In this code, we are making a GET request to the JSONPlaceholder API to fetch a list of posts. The axios.get method takes a URL as an argument and returns a Promise. We then use the then method to handle the successful response and the catch method to handle any errors.

Step 4: Making a POST Request

We can also make a POST request using Axios to send data to the server. Here is an example of how to make a POST request using Axios:

axios.post('https://jsonplaceholder.typicode.com/posts', {
  title: 'foo',
  body: 'bar',
  userId: 1
})
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

In this code, we are making a POST request to the JSONPlaceholder API to create a new post. We pass an object containing the data we want to send to the server as the second argument to the axios.post method.

Step 5: Handling Response Data

Once we have made a request using Axios, we can access the response data by using the response.data property. This property will contain the data returned by the server in the form of an object.

axios.get('https://jsonplaceholder.typicode.com/posts')
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

Step 6: Error Handling

In case there is an error in the HTTP request, we can catch the error using the catch method. We can then log the error to the console or perform any other necessary actions.

axios.get('https://jsonplaceholder.typicode.com/posts/1000')
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

In this code, we are making a request to a non-existent endpoint to simulate an error. We catch the error using the catch method and log it to the console.

Step 7: Conclusion

In this tutorial, we learned how to use Axios API in JavaScript for making HTTP requests. We learned how to install Axios, import it in our JavaScript file, make GET and POST requests, handle response data, and catch errors.

Axios is a powerful and easy-to-use library for making HTTP requests in JavaScript. It simplifies the process of making API calls and handling responses. I hope this tutorial was helpful for beginners in learning how to use Axios in JavaScript. Happy coding!

0 0 votes
Article Rating

Leave a Reply

1 Comment
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
@hamudxd9497
17 days ago

SIR YOU ARE GREAT❤

1
0
Would love your thoughts, please comment.x
()
x