Hope you're all doing good, I've tried looking around for a specific answer regarding this issue I'm having in ReactJS where I'm trying to map over an array I'm fetching via my local system and I keep getting this error in the console:

TypeError: null is not an object (evaluating 'daysData.map')

Here is a snapshot of my bit of code where I'm initializing the array from fetch:

And here it is in text format:

// Here I initalize the array with useState
  const [daysData, setDaysData] = useState(null);

  // Here is the port I'm fetching my array from.
  useEffect(() => {
    fetch('http://localhost:5001/chocolates')
      .then((resp) => resp.json())
      .then((data) => setDaysData(data));
  }, []);

  // Console logging is sending back the array with no issues
  console.log(daysData);

And here is the map function where I'm trying to render a with the 'id' key from the array:

Here is the bit of code in text format:

{/* Here I'm getting the error " TypeError: null is not an object (evaluating 'daysData.map') " */}
      {daysData.map((day) => (
        <div>{day.id}</div>
      ))}

And here is an example of the array where I've fetched data from in which I'm trying to map over:

Thanks for any help in advance