Connect with Theme (Liquid) to Remix App

[JanezPusnik]

We are having issues connecting a Shopify Theme (inside a Liquid file) to a Shopify App.

In general, our issue is that Liquid does not support receiving additional information from the B2B catalogs. To address this, we would like to write our own endpoint and call it from within Liquid. Upon receiving the data, we want to display it. For this reason, we will create a <script> section inside the Liquid file that will handle this process. Below is how the script section currently looks (the code is wrapped in <script> tags). 

const response = fetch("/apps/<app-subpath>/<endpoint>", {
     method: "GET",
     headers: {
       'Content-Type': "application/json",
     }
  });
  
  // Handling the promise with .then() and .catch()
response
  .then(res => {
    if (!res.ok) {
      throw new Error(`HTTP error! Status: ${res.status}`);
    }
    return res.json(); // Assuming the response is in JSON format
  })
  .then(data => {
    // Handle the JSON data from the response
    console.log(data);
  })
  .catch(error => {
    // Handle any errors
    console.error('There was an error!', error.message);
  });

And on the remix, we currently added a simple path to test it out

import { LoaderFunction } from "@remix-run/node";

// Loader function to handle GET requests
export let loader: LoaderFunction = async () => {
  return new Response("pong", {
    status: 200,
    headers: {
      "Content-Type": "text/plain",
    },
  });
};

Now looking at the app when we run it we can do a successful call to the endpoint, but how to do it in liquid? Is there anything special you have to configure? Is there any documentation detailed with an example of how to connect from liquid to the app?