Display data generated in the Shopify Node.js app backend

Technical Q&A

Topic summary

A developer building a Shopify Node.js app needs to display backend-computed store metrics (customers, orders, revenue) in frontend React components using Shopify Polaris. Data is fetched in server.js from the Shopify Admin API and Firebase, then aggregated into an array of integers (totals/subcounts).

Problem: The APIs are only accessible in server.js, and the developer doesn’t know how to pass the generated data into frontend files like index.js or _app.js to render inside a Polaris Card (e.g., Card props={DATA}).

Context: Shopify Admin API is the official store data API; Polaris is Shopify’s React UI library; Firebase is the app’s database. The code snippet shows intent to pass DATA as props but lacks a mechanism to bridge server-side data to the client.

Status: The question is open. The developer has searched documentation and resources without finding guidance and is seeking a method to transfer backend-derived data to React components for display.

Summarized with AI on March 5. AI used: gpt-5.
1

The app I’m building displays metrics for Shopify store owners. These metrics relate to their customers/orders/revenue, and I need to calculate subgroups/subtotals by comparing the Admin API with my own Firebase database.

I can access all of the APIs and databases no problem, but only in my server.js file (backend). Once I’ve created this data, for instance the total subcount of customers, how do I pass that into my index.js, _app.js, or any other component to display for the partner?

I need to pass the data into a Polaris Card component to display on the apps page of the partner’s Shopify store.

I can’t search google anymore because I’ve read every page on this, and the dev docs don’t explain this. Can anyone please help?

The following is what I need to do/have been doing

server.js

  • Fetch customers.json

  • Fetch firebase customers

  • DATA: Generate an array of ints containing the totals

index.js

import { Heading, Page } from “@shopify/polaris”;

const Index = () => {
return (



);
}

export default Index;

How do I pass this generated data into the card prop on my pages?

Thanks!