---
name: joonweb-sdk
description: Direct API schemas and SDK usage for @joonweb/joonweb-sdk (Node/PHP/React)
---

# Joonweb SDK Skill

Joonweb SDKs provide backend access to the Joonweb Admin API resources (Products, Orders, Customers, Inventory, Store Settings).

## 1. Node.js SDK (`@joonweb/api`)

Installation: `npm install @joonweb/api`

```typescript
import { JoonwebClient } from '@joonweb/api';

const client = new JoonwebClient({
  shop: 'example.joonweb.com',
  accessToken: process.env.JOONWEB_ACCESS_TOKEN!,
});

// Fetch Products
async function getProducts() {
  const response = await client.products.list({ limit: 10 });
  return response.data;
}

// Create Product
async function createProduct() {
  const newProduct = await client.products.create({
    title: 'AI Smart Watch',
    price: 99.99,
    description: 'High performance smartwatch',
    inventory_quantity: 50,
  });
  return newProduct;
}
```

## 2. React SDK (`@joonweb/react`)

Installation: `npm install @joonweb/react`

Provides pre-built UI components matching Joonweb Admin theme tokens.

```tsx
import { Page, Card, Button, DataTable } from '@joonweb/react';

export function ProductList() {
  return (
    <Page title="Products">
      <Card title="Inventory Management">
        <Button primary onClick={() => alert('Add Product')}>Add Product</Button>
      </Card>
    </Page>
  );
}
```