How to create an "offline" Shopify app

What I’ve been thinking about:

Oftentimes, I get the request to create a Shopify app that performs a background job.

For this, we can use an offline app. The problem is Shopify’s offline app documentation is very outdated, so; basically, there is no documentation about creating offline apps in 2023.

Here, I will show how to switch an online node.js Shopify app (default) to offline.

Step 1:

Create your Shopify node.js app using Shopify CLI in the command line.

Step 2:

Inside the app's root directory, find the .env file and fill the SHOP variable with the myshopify.com URL of the store you want to connect the app to.

Step 3:

In the app's root directory, find the index.js file inside the server folder and open it with your favorite code editor.

Inside the index.js file, create the following endpoint

Also, find the USE_ONLINE_TOKENS constant and set it to false.

Step 4:

In the root directory of the app, find the Homepage.jsx file inside the src/components/ folder and add the following button and function inside the <Page> component

Step 5:

In the command line, serve the app using the following code:

Once the app is served, create an installation link in your partner apps dashboard, install it and open it.

Once you open the app, click the button you created in step four.

Step 6:

In the command line where you performed the command shopify app serve, you will see an object with the following form:

Copy that object, we are using it in the next step.

Step 7:

Above the constant USE_ONLINE_TOKENS insert the following constant

And voila! Every time you need to perform a background job using your Shopify app, just call the offline_session constant instead of creating a session on the fly.

I.e., fetch the first 250 products in Shopify,

3 links you can’t miss:

• Shopify Polaris for VS Code -Official VS Code extension to work with the Polaris design system. Very useful when you are creating Shopify apps.

• Storefront API Learning Kit - Github repo with lots of examples to learn how to perform Storefront API calls from a Shopify app.
• Buy With Prime Button - Insert the buy with prime button in your Shopify store and increase sales!

One app I like:

SlideRule Google Analytics 4 by SlideRule

This Shopify to Google Analytics 4 app allows you to view your entire conversion funnel in GA4. This app adds all conversion and product data formatted to the new Google Analytics 4 standard. No more missed events or incorrectly formatted product information. You can complete your GA4 migration in minutes, not days. It includes the following GA4 events: purchase add_to_cart add_payment_info add_shipping_info begin_checkout remove_from_cart view_cart view_item view_item_list refunds