Populate Data on load (React)

import axios from 'axios';
import { useEffect, useState } from 'react';
 
export default function App() {
  const [imgdat, setImgdat] = useState([]);
  useEffect(() => {
    axios
      .get('https://jsonplaceholder.typicode.com/photos')
      .then(({ data }) => {
        setImgdat(data);
      });
  }, []);
 
  return (
    <div className="App">
      {imgdat.map((item, index) => {
        return <img alt="data" src={item.thumbnailUrl} key={index} />;
      })}
      <h1>Data from JSON Placeholder</h1>
    </div>
  );
}