Three separate build targets. Each surface runs on a different Shopify platform, uses a different component system, and has a different actor. Pick the surface to explore.
Shopify App (Remix + Polaris). Runs inside the Shopify Admin iframe. Actor: merchant / shop staff.
Enter admin →Theme app block. Runs inside the merchant's Online Store storefront. Actor: customer (anonymous or logged in).
Enter storefront →Platform context
No Polaris · No App Bridge · No Remix.
Scoped CSS inside .class-app-booking-widget.
JS budget constrained by theme extension limits.
Customer account UI extension. Runs inside Shopify new customer accounts. Actor: logged-in customer.
Enter customer account →Platform context
No Polaris · No App Bridge · No Remix.
Uses @shopify/ui-extensions-react/customer-account.
Scoped inside .class-app-account-extension.
| Surface | Actor | Platform | Component system | Entry URL |
|---|---|---|---|---|
| Merchant admin | Merchant / staff | Shopify Admin (embedded app) | Polaris + Remix + App Bridge | /home.php |
| Storefront | Customer (anon/logged in) | Online Store (theme app block) | Vanilla JS + scoped CSS |
/storefront/widget-demo.php
|
| Customer account | Logged-in customer | Shopify new customer accounts | ui-extensions-react/customer-account |
/customer-account/index.php
|
All pages use static PHP arrays from _mock-data.php — no database, no live API calls.
Dev notes (blue boxes) on every surface page document the real API contracts and data shapes for backend handoff.