Create a food ordering app with Strapi and Next.js 2/7

I also had trouble displaying the restaurant images. I incorporated the recommendations that have been posted in the comments. In addition, I amended the RestaurantCard Image as follows:

Instead of:

<Image
          className="w-full rounded-2xl"
          height={300}
          width={300}
          src={`${process.env.STRAPI_URL || "http://localhost:1337"}${
            data.attributes.image.data[0].attributes.url
          }`}
          alt=""
        />

I used:

<Image
className=“w-full rounded-2xl”
height={300}
width={300}
src={${process.env.STRAPI_URL || "http://127.0.0.1:1337"}${ data.attributes.image.data.attributes.url }}
alt=“”
/>