> ## Documentation Index
> Fetch the complete documentation index at: https://docs.openbridge.shop/llms.txt
> Use this file to discover all available pages before exploring further.

# Quickstart

> Get started in under 5 minutes

## 1. Get Storefront Token

<Steps>
  <Step title="Open Shopify Admin">
    Settings → Apps and sales channels → Develop apps
  </Step>

  <Step title="Create App">Create an app → Name it "OpenBridge"</Step>

  <Step title="Configure Storefront API">
    Configuration → Storefront API integration → Configure

    Enable scopes:

    * `unauthenticated_read_product_listings`
    * `unauthenticated_read_collection_listings`
    * `unauthenticated_read_customers`
    * `unauthenticated_write_customers`
    * `unauthenticated_read_customer_tags`
  </Step>

  <Step title="Get Token">
    API credentials → Install app → Copy **Storefront API access token**
  </Step>
</Steps>

<Warning>
  Use the **Storefront** token, not Admin. Storefront tokens are safe for
  client-side use.
</Warning>

<Tip>
  By default the token works from any origin. To lock it down to your own domains, see [Allowed Origins](/allowed-origins).
</Tip>

***

## 2. Add Script

```html theme={null}
<script src="https://cdn.openbridge.shop"></script>
```

***

## 3. Initialize

```javascript theme={null}
const ready = await openbridge.init({
    token: 'your-storefront-access-token',
    storeDomain: 'your-store.myshopify.com'
})
```

`init()` returns `Promise<boolean>` — resolves to `true` once the Storefront API has been reached successfully.

### Configuration options

| Option        | Type     | Required | Description                                                         |
| ------------- | -------- | -------- | ------------------------------------------------------------------- |
| `token`       | `string` | Yes      | Your Shopify Storefront API access token.                           |
| `storeDomain` | `string` | Yes      | Your `*.myshopify.com` domain.                                      |
| `apiVersion`  | `string` | No       | Storefront API version (e.g. `'2025-01'`). Defaults to `'2024-01'`. |

***

## 4. Query Data

```javascript theme={null}
// List products
const { items } = await openbridge.products.list()

// Products from collection
const { items } = await openbridge.products.list().collection('sale')

// Single product
const product = await openbridge.products.get('product-handle')

// With options
const { items } = await openbridge.products
    .list()
    .limit(12)
    .select(['title', 'handle', 'priceRange', 'featuredImage'])
```

***

## 5. Customer Authentication

```javascript theme={null}
// Initialize customer session on page load
const customer = await openbridge.customer.init()

// Login
const customer = await openbridge.customer.login('email@example.com', 'password')

// Register new customer
const customer = await openbridge.customer.register({
    email: 'new@example.com',
    password: 'password123',
    firstName: 'John',
    lastName: 'Doe'
})

// Get order history
const { orders } = await openbridge.customer.orders()

// Logout
await openbridge.customer.logout()
```

***

## Next

<CardGroup cols={2}>
  <Card title="Products" icon="box" href="/api/products/overview">
    Query products
  </Card>

  <Card title="Collections" icon="folder" href="/api/collections/overview">
    Query collections
  </Card>

  <Card title="Cart" icon="cart-shopping" href="/api/cart/overview">
    Manage cart
  </Card>

  <Card title="Customer" icon="user" href="/api/customer/overview">
    Authentication
  </Card>

  <Card title="Allowed Origins" icon="globe" href="/allowed-origins">
    Restrict your token
  </Card>
</CardGroup>
