Shopify App Bridge Skill

Shopify App Bridge is a library that allows you to embed your app directly inside the Shopify Admin. It provides a way to communicate with the host environment to trigger actions and navigation.

[!NOTE] This skill focuses on Shopify App Bridge v3 (NPM package) and App Bridge CDN (v4) patterns. ALWAYS check which version the project is using. The latest standard is often typically App Bridge v4 (CDN-based / overview script) but many React apps still use @shopify/app-bridge-react (v3/v4 wrapper).

Core Concepts

• Host: The Shopify Admin (web or mobile).
• Client: Your embedded app.
• Actions: Messages sent to the host to trigger UI elements (Toast, Modal) or navigation.

Setup & Initialization

Using CDN (App Bridge v4 - Recommended)

In modern Shopify apps, the preferred method is using the CDN script. This automatically exposes the shopify global variable, which is the primary entry point for all actions.