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

# Огляд для Hydrogen

> Як підключити plata checkout до Hydrogen або іншого headless Shopify-фронту.

**Hydrogen / headless** не має `theme.liquid`, тому авто-інжект `plata-script.js` **не застосовується**. Магазин у plata підключається так само (OAuth + інтеграції), а редірект на чекаут ви робите у своєму коді.

<Note>
  Окремої кнопки «Connect Hydrogen» у продукті зараз немає. Цей гайд описує підтримуваний контракт API/сесій, яким користується Liquid-скрипт під капотом.
</Note>

## Що спільного з Liquid

1. Реєстрація в plata
2. [Підключення Shopify](/liquid/connect-shopify) (той самий OAuth)
3. [Інтеграції](/dashboard/integrations) (Monobank, Нова Пошта…)

## Що відрізняється

| Liquid                         | Hydrogen                                               |
| ------------------------------ | ------------------------------------------------------ |
| Скрипт у темі ловить DOM-кліки | Ви самі викликаєте redirect                            |
| Режим `ua` / `all` у кабінеті  | Логіку «коли слати на plata» пишете ви                 |
| Сторінка **Скрипти** корисна   | Можна ігнорувати (inject нічого не змінить на вітрині) |

## Шлях покупця

```text theme={null}
Клік «Оформити» у вашому UI
  → GET /c/start?shop={domain}&cart={cartToken}
  → plata читає Storefront cart
  → redirect на /c/{token}
  → оплата + доставка
```

## Далі

<CardGroup cols={2}>
  <Card title="Передумови" icon="list-check" href="/hydrogen/prerequisites">
    Що має бути готове перед кодом.
  </Card>

  <Card title="Підключення чекауту" icon="plug" href="/hydrogen/wire-checkout">
    Контракт `shop` + `cart` і куди редіректити.
  </Card>
</CardGroup>