Axios :
Axios is a popular Http Client that allows us to make get and Post request from the browser.
If you make a Get Request you expect to get back data to display in your appilcation


DataBAse and web services have an API , which apps can communicate with through the URL .
An API allows apps to retrievs or send the data to and from the database or web services.


step1 : we have to declare state
step2 : we have to write in function or useeffect.
step 3 : if want in load page we will write in useeffect or if we want in button click then we will declare in

onload :
useeffect(() => {
}

On click :
Const onclick = () =>
{
}
(button onClick ={ onclick }>
(/button>

step 4 : In html we have to map the data , then it will loop the data
get { data && data.length > 0 data.map(item => {
}
why we writing this because first it will enter into return it will goto useEffect

Example:
import "./styles.css";
import axios from "axios";
import { useEffect, useState } from "react";
export default function App() {
const [data, setData] = useState([]);
useEffect(() => {
getdata();
}, []);
const getdata = async () => {
try {
const det = await axios.get("https://jsonplaceholder.typicode.com/users");
console.log(det, "det");
setData(det.data);
} catch (error) {}
};
return (
(div className="App">
(h1> Hello (/h1>
(h2> Table list (/h2>
(table>
(tr>
(th> id (/th)
(th>name (/th>
(th>email (/th>
<(th>Adress (/th>
(/tr>
{data && data.length > 0 ? data.map((k) => {
return (
(tr>
(td>{k.id}(/td>
(td>{k.name}(/td>
(td>{k.email}(/td>
(td>{k.address.street}(/td>
(/tr>
);
})
: null}
{/* (/div> */}
(/table>
(/div>
);
}


Apps use HTTp request ,
for Example : GET , POst , and Put to communicate with API's .
IN short Axios makes easy for our apps to performs these commands.


why use axios in react :

It has good default to work with JSON data. Unlikes alternative such as the Fetch API , you often don't need to set your header . or performs tasks like converting your request body to a Json string. Axios has function name that match any HTTP methods . To performs to GET request you use the .get() Method. Axios does more with less code . unlike the Fetch API , you only need one .then() callback to access you request JSoN data.