> ## 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.

# Introduction

> Lightweight TypeScript client for Shopify Storefront API

## What is OpenBridge?

A minimal, type-safe client for Shopify's Storefront API. Built for modern JavaScript with a chainable query builder pattern.

```javascript theme={null}
const { items } = await openbridge.products
    .list()
    .collection('sale')
    .limit(12)
    .select(['title', 'priceRange', 'featuredImage'])
```

## Features

<CardGroup cols={2}>
  <Card title="TypeScript First" icon="code">
    Full type inference and autocompletion
  </Card>

  <Card title="Chainable API" icon="link">
    Intuitive query builder pattern
  </Card>

  <Card title="Zero Dependencies" icon="feather">
    Single file, no runtime deps
  </Card>

  <Card title="Field Selection" icon="filter">
    Request only what you need
  </Card>
</CardGroup>

## Quick Look

```javascript theme={null}
// Initialize
openbridge.init({
    token: 'your-storefront-token',
    storeDomain: 'store.myshopify.com'
})

// Collections
const collections = await openbridge.collections.list()
const collection = await openbridge.collections.get('summer-sale')

// Products
const products = await openbridge.products.list()
const product = await openbridge.products.get('blue-shirt')

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

// With options
const result = await openbridge.products
    .list()
    .collection('new')
    .limit(6)
    .select(['title', 'handle', 'priceRange'])

// Cart
await openbridge.cart.init()
await openbridge.cart.add('gid://shopify/ProductVariant/123', 2)
openbridge.cart.checkout()

// Customer Authentication
const customer = await openbridge.customer.login('email@example.com', 'password')
const { orders } = await openbridge.customer.orders()
await openbridge.customer.logout()
```

## API Reference

<CardGroup cols={2}>
  <Card title="Products" icon="box" href="/api/products/overview">
    List, get, filter
  </Card>

  <Card title="Collections" icon="folder" href="/api/collections/overview">
    List, get, search
  </Card>

  <Card title="Cart" icon="cart-shopping" href="/api/cart/overview">
    Add, update, checkout
  </Card>

  <Card title="Customer" icon="user" href="/api/customer/overview">
    Auth, orders, addresses
  </Card>

  <Card title="Types" icon="brackets-curly" href="/api/types/overview">
    Interfaces
  </Card>
</CardGroup>
