Metaobject updating with Shopify Matrix

Question

fairly new to shopify app dev and seems like using their new Remix platform is most advised however since it's fairly new it looks like resources are very limited.

Trying to setup a functions to save data to a global metaobject or metafield but keep getting an error regarding the json request.

Is there any resources out there regarding metafield data saving or perhaps anything obviously incorrect with my functions:

  const saveMeta = async () => {
      console.log("data sending");
      await saveToMetafield("googleApiKey", unsavedGoogleApiKey);
      await saveToMetafield("googleFrequency", unsavedGoogleFrequency);
      await saveToMetafield("placeId", unsavedPlaceId);
  };

  const saveToMetafield = async (key, value) => {
    // Define the metafield data
    const metafieldData = {
      "namespace": "quickstart-45af53ae",
      "key": key,
      "value": value,
      "value_type": "string"
    };
  
    // Save the metafield data
    const response = await window.fetch('/admin/api/2023-10/metafields.json', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({ metafield: metafieldData }),
    });
  
    if (!response.ok) {
      throw new Error(`HTTP error! status: ${response.status}`);
    } else {
      console.log(`Metafield ${key} saved successfully`);
    }
  };

Gives a 404 error regarding the metafields.json

VM14 app-bridge.js:1 POST https://rev-departments-fiction-aspect.trycloudflare.com/admin/api/2023-10/metafields.json 404 (Not Found)

I try changing it to the exact URL that does work but then I get a CORS error Access to fetch at 'https://admin.shopify.com/store/quickstart-917519751/admin/api/2023-10/metafields.json' from origin 'https://rev-departments-fiction-aspect.trycloudflare.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Any help or resources would be appreciated thank you!

tried changing the URL direct but now gives a CORS error tried multiple variations of the json URL with no luck