client side data with fetch

test.js

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

const Page = () => {
  const [response, setResponse] = useState(false);

  useEffect(() => {
    const getData = async () => {
      const response = await fetch(
        'https://api.oceandrivers.com/api/ODWeather'
      );

      const data = await response.json();

      setResponse(data.apis);
    };
    getData();
  }, []);

  return (
    <main>
      {response ? (
        <ul>
          {response.map((item, index) => {
            const { operations } = item;

            return <li key={index}>{operations[0].notes}</li>;
          })}
        </ul>
      ) : (
        <div>Loading...</div>
      )}
    </main>
  );
};

export default Page;