interviewer favourite question react js

call api

01. by fetch method ..

import React, { useState, useEffect } from 'react';

function ApiExample() {

 const [data, setData] = useState([]);

const fetchData = async () => {
 try {
 const response = await fetch('https://jsonplaceholder.typicode.com/posts');
 const jsonData = await response.json();
 setData(jsonData);

 } catch (error) {
 console.error('Data was not fetched:', error);
 }

 };

useEffect(() => {
 fetchData();
 }, []);

return (
 <div>
 <h1>Posts</h1>
 <ul>
 {data.map(d => (
 <li key={d.id}>
 <h2>{d.title}</h2>
 <p>{d.body}</p>
 </li>
 ))}
 </ul>
 </div>
 );
}
export default ApiExample;

02.by axios method

import React, { useState, useEffect } from 'react';
import axios from 'axios';

function FetchDataExample() {

const [user,setUser]=useState([])
useEffect(()=>{
fetchDAta()
},[])
  
const fetchData=async()=>{
try{
const response =await axios.get('https://jsonplaceholder.typicode.com/posts')se
setUser(response.user)
}
catch(error){
console.error('data was not fetched:',error)
}

}
  return (
    <div>
<u>
{data.map(D=>(
<li key={d.id}>
<h3> {user.title}</h3>
<p> {user.body}</p>
</li>
))}
</ul>

</div>
  );
}

export default FetchDataExample;