Team system · Mar 2026
Shopify App TanStack React
A Shopify app starter built with React and TanStack, with authentication, webhooks, Polaris, App Bridge, and a reusable application structure.
- Role
- Technical contributor and team collaborator
- Stack
- react, shopify, typescript, javascript
- Author
- Yanuar Aditia · Yan Ad
The recurring setup problem
Shopify provides APIs, a CLI, and official templates. Most React starters still leave teams to reconnect authentication, embedded app context, webhooks, API access, and deployment conventions for each project.
The goal of this repository is to keep those decisions in one understandable starting point for teams that prefer the TanStack ecosystem.
What the starter includes
- Shopify OAuth and embedded app handling
- Webhook registration and processing
- Polaris components and App Bridge integration
- TanStack Router and Query for navigation and server data
- TypeScript across the application boundary
- Deployment configuration for common hosting platforms
The structure keeps Shopify communication separate from UI code so engineers can trace requests and replace individual parts without depending on hidden framework behavior.
Repository
Clone github.com/yan-ad/shopify-app-tanstack, add the Shopify API credentials described in the README, and run the development server.
The repository is the artifact for this case study. It shows the authentication flow, embedded context, routing, data access, and webhook setup directly.
Why this exists
The same setup questions appeared in each Shopify project: where authentication lives, how embedded context reaches the UI, where API calls belong, and how deployment is configured.
This starter records those decisions once. Product teams can begin with a working Shopify application structure and change the parts that differ for their product.