How To Communicate App admin With Theme App Extensions?

Shopify Apps
1

Hello, I am new to Shopify development.

I am looking for a way to have my remix app communicate with my theme app extensions? I have both created, but for example if my app has the merchant input some text into a text field within the app in the admin, how do I make it so that text is sent over to the theme app extension so that it can be shown within the theme in a product page for example?

I am aware of how the communication is between the assets and css files and the liquid files within the theme app extension, but have no idea how to have the remix react code useStates and variables be sent over to the extension.

Thanks in advance!

2 Likes
2

Hey, have you found a solution for this? I am also struggling with it.

3

I would like to know this too.

4

You usually do this via a database and proxy urls.

So, in admin side, you store all your state in a database and then on storefront, you make a call to proxy url that sends a request to your app and retrieve that data from db and show it in storefront.

So, what you need is that, in remix app, in your .toml configuration file, you need to register the proxy urls like this

```

[app_proxy]
url = "https://<your-app-domain>/apps/<whatever-sub-path-you-give>"
subpath = "<whatever-sub-path-you-give>"
prefix = "apps"

Then, you need to create a route that matches /apps//discounts (discounts is an example)

In remix, under routes dir, you can create this proxy route app.whatever-sub-path-you-give.discounts/route.ts

And this route.ts is where you retrieve data from database and return as a response and in storefront you then make a request to this proxy endpoint

```

  const res = await fetch(`/apps/<whatever-sub-path-you-give>/discounts?${queryStrings.toString()}`, {
      credentials: 'same-origin',
      headers: { Accept: 'application/json', 'ngrok-skip-browser-warning': 'true' },
    });
    if (!res.ok) return null;

This will give you data from db on storefront and on storefront you will then need to write html css, js etc to make this data look pretty and show to the user