reactjs-id/src/App.js

A function that generates unique identifiers which can be used when mapping through list of items in React.Js

import React from "react";

function App() {
  const [user, setUser] = React.useState([]);
  
   React.useEffect(() => {
    fetchData();
   }, []);
  
  const url = 'https://randomuser.me/api/'
  const fetchData = async () => {
    const response = await fetch(url)
    const data = await response.json();
    setUser(data);
  };
  

 
  console.log(user, 'user');

  return Object.keys(user).length > 0 ? (

    
    <div style={{padding: "40px"}}>
      <h1>Customer data</h1>
      {user.results.map((customer, index) => {
        return <><h2 key={index}>Name: {customer.name.title} {customer.name.first} {customer.name.last}</h2>
       <img src= {customer.picture.large} key={index} alt=''/>
        </>
    })}
    </div>
  ) : (
     
     <h1>Data pending...</h1>
  );
}

export default App;