How to fix CORS error "http://localhost:3000 is not allowed by Access-Control-Allow-Origin" in a react-app?

Question

I did find a solution approach to this for express servers, but I am not able to implement the same to my react-app.

referred to this. Please suggest. (I am beginner to CORS)

Here is my App.js file:

import { useEffect, useState } from "react";
import "./App.css";

function App() {

  const APP_ID = "--"
  const APP_KEY = "--"

  const [counter, setCounter] = useState(0);

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

  const getRecipes = async () => {
    const response = await fetch(`https://api.edamam.com/search?q=chicken&app_id=${APP_ID}&app_key=${APP_KEY}&from=0&to=3&calories=591-722&health=alcohol-free`);
    const data = response.json();
    console.log(data);
  }

  return <div className="App">
    <form className="search-form">
      <input className="search-bar" type="text" placeholder="Search query here!" />
      <button
        className="search-button" type="submit">
        Search
      </button>
    </form>
    <h1 onClick={() => setCounter(counter + 1)}>{counter}</h1>
  </div>;
}

export default App;