For Developers 20 min read 12.14.2025

Integrating Hypertrade into Your dApp

A Complete Developer's Guide

Интеграция Hypertrade в ваш dApp — это самый быстрый способ добавить лучшие swap-курсы и полноценный обмен токенов в экосистеме Hyperliquid без разработки собственного DEX-агрегатора.

Зачем интегрировать Hypertrade в ваш dApp?

Если вы разрабатываете decentralized application (dApp) на Hyperliquid — DeFi-протокол, wallet, portfolio tracker, NFT marketplace или любой другой продукт — вашим пользователям необходим быстрый и выгодный обмен токенов прямо внутри приложения.

Проблема разработки собственного swap-функционала

  • ❌ Интеграция каждого DEX по отдельности (Hyperswap, Kittenswap, HyperCore Spot, Prjx)
  • ❌ Разработка алгоритмов маршрутизации для поиска лучшей цены
  • ❌ Постоянное обновление контрактов и API
  • ❌ Недели или месяцы разработки и тестирования

Решение: интеграция Hypertrade за 30–60 минут

  • ✅ Доступ ко всем DEX Hyperliquid через единый API
  • ✅ Автоматическая оптимизация маршрутов (split-routing, price comparison)
  • ✅ Invisium Simulations — точные котировки (99.5–99.9%)
  • ✅ 0% platform fee — вся экономия остаётся пользователям
  • ✅ Постоянные обновления и поддержка новых DEX
  • ✅ REST API, TypeScript / JavaScript SDK, React hooks

Что получают ваши пользователи

Лучшие курсы обмена

Экономия от 0.5% до 5% на каждом swap за счёт агрегации ликвидности.

Минимальный price impact

Split-routing распределяет ордер между DEX для лучшей цены.

Полная прозрачность

Детали маршрута и симуляция результата перед подтверждением.

Удобный UX

Обмен токенов в один клик без выхода из приложения.

Что получает ваш dApp

Дополнительную ценность для пользователей (swap без выхода из приложения)

Опциональные referral fees — делитесь комиссиями с Hypertrade

Повышение retention и времени взаимодействия с продуктом

Сильную экономию времени разработки и поддержки

Примеры интеграции Hypertrade

  • DeFi Dashboard — встроенный swap для ребалансировки портфеля
  • Wallet — нативная функция обмена токенов
  • NFT Marketplace — конвертация ETH ⇄ USDC для покупки NFT
  • Yield Optimizer — автоматический swap для входа в фарминг
  • Trading Bot — API для автоматизированных стратегий

Быстрый старт: интеграция за 30 минут

Шаг 1: Установка SDK

Для TypeScript/JavaScript проектов:

npm install @hypertrade/sdk # или yarn add @hypertrade/sdk

Для React приложений:

npm install @hypertrade/sdk @hypertrade/react-hooks

Для других языков:

  • Python SDK — в разработке (ETA Q1 2025)
  • REST API — работает со всеми языками (см. ниже)

Шаг 2: Получение API ключа (опционально)

Публичный API (без регистрации):

  • ✅ Доступен для всех
  • ✅ Rate limit: 100 requests/minute
  • ✅ Подходит для большинства dApps

API ключ (с регистрацией):

  • ✅ Rate limit: 1000 requests/minute
  • ✅ Приоритетная обработка запросов
  • ✅ Доступ к referral program
  • ✅ Детальная аналитика использования

Получение API ключа:

  1. Перейдите на https://docs.hypertrade.io/api-keys
  2. Подключите wallet (MetaMask)
  3. Заполните форму (название dApp, контакты, ожидаемый объём)
  4. Получите API key и secret

Шаг 3: Базовая интеграция (React пример)

Простейший пример — встроенный swap виджет:

import { HypertradeSwapWidget } from '@hypertrade/react-hooks';

function MyApp() {
  return (
    <div>
      <h1>My DeFi Dashboard</h1>
      
      {/* Встроенный swap виджет */}
      <HypertradeSwapWidget
        defaultTokenIn="USDC"
        defaultTokenOut="ETH"
        theme="dark" // или "light"
        onSwapSuccess={(result) => {
          console.log('Swap completed:', result);
          // Обновите баланс пользователя, покажите уведомление, etc.
        }}
      />
    </div>
  );
}

Результат: полнофункциональный swap интерфейс за 5 строк кода.

Шаг 4: Кастомизация UI

Если вам нужен больший контроль над UI:

import { useHypertrade, useQuote, useSwap } from '@hypertrade/react-hooks';
import { useState } from 'react';

function CustomSwapInterface() {
  const [tokenIn, setTokenIn] = useState('USDC');
  const [tokenOut, setTokenOut] = useState('ETH');
  const [amountIn, setAmountIn] = useState('1000');

  // Получить котировку
  const { data: quote, isLoading } = useQuote({
    tokenIn,
    tokenOut,
    amountIn,
    slippage: 1.0, // 1%
  });

  // Выполнить swap
  const { swap, isSwapping } = useSwap();

  const handleSwap = async () => {
    try {
      const result = await swap({
        tokenIn,
        tokenOut,
        amountIn,
        quote: quote.route, // использовать найденный маршрут
      });
      
      console.log('Swap success:', result);
      alert(`Received ${result.amountOut} ${tokenOut}`);
    } catch (error) {
      console.error('Swap failed:', error);
      alert('Swap failed: ' + error.message);
    }
  };

  return (
    <div className="custom-swap">
      <h2>Swap Tokens</h2>
      
      {/* Input */}
      <div>
        <label>From:</label>
        <input 
          type="number" 
          value={amountIn} 
          onChange={(e) => setAmountIn(e.target.value)} 
        />
        <select value={tokenIn} onChange={(e) => setTokenIn(e.target.value)}>
          <option value="USDC">USDC</option>
          <option value="ETH">ETH</option>
          <option value="HYPE">HYPE</option>
        </select>
      </div>

      {/* Output (котировка) */}
      <div>
        <label>To (estimated):</label>
        {isLoading ? (
          <p>Loading quote...</p>
        ) : (
          <p>{quote?.amountOut} {tokenOut}</p>
        )}
      </div>

      {/* Детали */}
      {quote && (
        <div className="quote-details">
          <p>Price Impact: {quote.priceImpact}%</p>
          <p>Min. Received: {quote.minAmountOut} {tokenOut}</p>
          <p>Route: {quote.route.map(r => r.dex).join(' → ')}</p>
          <p>You save:  vs. single DEX</p>
        </div>
      )}

      {/* Swap button */}
      <button 
        onClick={handleSwap} 
        disabled={isSwapping || !quote}
      >
        {isSwapping ? 'Swapping...' : 'Swap'}
      </button>
    </div>
  );
}

Результат: полный контроль над UI при использовании логики Hypertrade.

API Reference: основные endpoints

Base URL:

https://api.hypertrade.io/v1

Все запросы поддерживают:

  • Content-Type: application/json
  • Authorization: Bearer YOUR_API_KEY (опционально, для увеличенного rate limit)

1. GET /quote — получить котировку

Описание: получить лучший маршрут и ожидаемый результат для swap.

Parameter	Type	Required	Description
tokenIn	string	Yes	Contract address или symbol (например, “USDC” или “0x…”)
tokenOut	string	Yes	Contract address или symbol
amountIn	string	Yes	Сумма в smallest units (например, “1000000000” для 1000 USDC с 6 decimals)
slippage	number	No	Slippage tolerance в % (default: 1.0)
userAddress	string	No	Адрес пользователя (для персонализированных маршрутов)

Example Request:

curl -X GET "https://api.hypertrade.io/v1/quote?tokenIn=USDC&tokenOut=ETH&amountIn=10000000000&slippage=1.0" \
  -H "Authorization: Bearer YOUR_API_KEY"

Example Response:

{
  "success": true,
  "data": { ... }
}

Response Fields:

  • amountOut — ожидаемое количество выходных токенов (wei/smallest units)
  • amountOutHuman — человекочитаемый формат (с учётом decimals)
  • minAmountOut — минимум с учётом slippage (защита от unexpected slippage)
  • priceImpact — price impact в % (0.51% в примере)
  • route[] — детали маршрута (какие DEX, какой % ордера, какой impact на каждом)
  • savings — сколько экономите vs. best single DEX

2. POST /swap — выполнить swap

Описание: построить транзакцию для выполнения swap.

Request Body:

{
  "tokenIn": "USDC",
  "tokenOut": "ETH",
  "amountIn": "10000000000",
  "slippage": 1.0,
  "userAddress": "0x742d35Cc6634C0532925a3b844Bc9e7595f0bEb",
  "route": { /* route object from /quote */ }
}

Example Request:

curl -X POST "https://api.hypertrade.io/v1/swap" \
  -H "Content-Type: application/json" \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -d '{ ... }'

Example Response:

{
  "success": true,
  "data": { ... }
}

Response Fields:

  • to — адрес Hypertrade Router contract
  • data — encoded transaction data
  • value — ETH value (обычно “0”, если не покупаете native token)
  • gasLimit — рекомендуемый gas limit
  • gasPrice — рекомендуемый gas price (в wei)

const tx = await wallet.sendTransaction({
  to: swapData.to,
  data: swapData.data,
  value: swapData.value,
  gasLimit: swapData.gasLimit,
  gasPrice: swapData.gasPrice,
});

const receipt = await tx.wait();
console.log('Swap completed:', receipt);

3. GET /tokens — список поддерживаемых токенов

Описание: получить список всех токенов, доступных для swap на Hyperliquid.

Example Request:

curl -X GET "https://api.hypertrade.io/v1/tokens?chainId=998"

Example Response:

{
"success": true,
"data": [
  {
    "symbol": "USDC",
    "name": "USD Coin",
    "address": "0x...",
    "decimals": 6,
    "logoURI": "https://...",
    "verified": true
  },
  {
    "symbol": "ETH",
    "name": "Wrapped Ether",
    "address": "0x...",
    "decimals": 18,
    "logoURI": "https://...",
    "verified": true
  },
  {
    "symbol": "HYPE",
    "name": "Hyperliquid",
    "address": "0x...",
    "decimals": 18,
    "logoURI": "https://...",
    "verified": true
  }
]
}

4. GET /price — текущая цена токена

Описание: получить текущую рыночную цену токена в USDC.

Example Request:

curl -X GET "https://api.hypertrade.io/v1/price?token=ETH"

Example Response:

{
"success": true,
"data": {
  "token": "ETH",
  "priceUSD": 2500.45,
  "change24h": 3.2,
  "volume24h": 125000000,
  "timestamp": 1702345678
}
}

5. GET /liquidity — ликвидность пары

Описание: получить информацию о ликвидности для торговой пары.

Example Request:

curl -X GET "https://api.hypertrade.io/v1/liquidity?tokenA=USDC&tokenB=ETH"

Example Response:

{
"success": true,
"data": {
  "pair": "USDC/ETH",
  "totalLiquidityUSD": 5200000,
  "sources": [
    {
      "dex": "HyperCore Spot",
      "liquidityUSD": 2100000,
      "percentage": 40.4
    },
    {
      "dex": "Hyperswap",
      "liquidityUSD": 1800000,
      "percentage": 34.6
    },
    {
      "dex": "Kittenswap",
      "liquidityUSD": 1300000,
      "percentage": 25.0
    }
  ],
  "timestamp": 1702345678
}
}

6. GET /status — статус API

Описание: проверить здоровье API и доступность сервисов.

Example Request:

curl -X GET "https://api.hypertrade.io/v1/status"

Example Response:

{
"success": true,
"data": {
  "status": "operational",
  "version": "1.2.4",
  "uptime": "99.98%",
  "services": {
    "router": "operational",
    "invisium": "operational",
    "hypercore": "operational",
    "hyperswap": "operational",
    "kittenswap": "operational"
  },
  "latency": {
    "quote": "120ms",
    "swap": "850ms"
  }
}
}

npm install @hypertrade/sdk ethers

import { HypertradeSDK } from '@hypertrade/sdk';
import { ethers } from 'ethers';

// Подключение к Hyperliquid
const provider = new ethers.JsonRpcProvider('https://api.hyperliquid.xyz/evm');
const signer = new ethers.Wallet(PRIVATE_KEY, provider);

// Инициализация SDK
const hypertrade = new HypertradeSDK({
  provider,
  signer,
  apiKey: 'YOUR_API_KEY', // опционально
  chainId: 998, // Hyperliquid
});

Основные методы:

1. getQuote() — получить котировку
const quote = await hypertrade.getQuote({
  tokenIn: 'USDC',
  tokenOut: 'ETH',
  amountIn: ethers.parseUnits('1000', 6), // 1000 USDC (6 decimals)
  slippage: 1.0, // 1%
});

console.log('You will receive:', ethers.formatUnits(quote.amountOut, 18), 'ETH');
console.log('Price impact:', quote.priceImpact, '%');
console.log('Route:', quote.route.map(r => `${r.percentage}% via ${r.dex}`));

2. executeSwap() — выполнить swap

try {
  const tx = await hypertrade.executeSwap({
    tokenIn: 'USDC',
    tokenOut: 'ETH',
    amountIn: ethers.parseUnits('1000', 6),
    slippage: 1.0,
    deadline: Math.floor(Date.now() / 1000) + 600, // 10 минут
  });

  console.log('Transaction sent:', tx.hash);
  
  const receipt = await tx.wait();
  console.log('Swap completed!');
  console.log('Gas used:', receipt.gasUsed.toString());
  
} catch (error) {
  console.error('Swap failed:', error);
}

3. approveToken() — approve токен

Перед первым swap токена нужно дать approval Hypertrade Router:

// Проверить, нужен ли approval
const allowance = await hypertrade.checkAllowance('USDC');
const amountIn = ethers.parseUnits('1000', 6);

if (allowance < amountIn) {
  console.log('Approval needed...');
  
  const approveTx = await hypertrade.approveToken('USDC', amountIn);
  await approveTx.wait();
  
  console.log('Approval successful!');
}

// Теперь можно делать swap
const swapTx = await hypertrade.executeSwap({ ... });

Рекомендация: используйте limited approval (точная сумма или сумма + 10%), а не unlimited.

4. getTokens() — список токенов

const tokens = await hypertrade.getTokens();

console.log('Available tokens:');
tokens.forEach(token => {
  console.log(`${token.symbol} (${token.name}): ${token.address}`);
});

5. getPrice() — текущая цена

const ethPrice = await hypertrade.getPrice('ETH');
console.log('ETH price:', ethPrice.priceUSD, 'USD');
console.log('24h change:', ethPrice.change24h, '%');

6. simulateSwap() — симуляция без выполнения

Полезно для тестирования:

const simulation = await hypertrade.simulateSwap({
    tokenIn: 'USDC',
    tokenOut: 'ETH',
    amountIn: ethers.parseUnits('10000', 6), // крупный ордер
    slippage: 1.0,
});

console.log('Simulated result:');
console.log('Amount out:', ethers.formatUnits(simulation.amountOut, 18), 'ETH');
console.log('Price impact:', simulation.priceImpact, '%');
console.log('Gas cost:', simulation.gasCostUSD, 'USD');

// Проверить, выполнится ли swap
if (simulation.success) {
    console.log('✅ Swap will succeed');
} else {
    console.error('❌ Swap will fail:', simulation.error);
}

React Hooks Reference

npm install @hypertrade/react-hooks ethers wagmi

Setup Provider:

import { HypertradeProvider } from '@hypertrade/react-hooks';
import { WagmiConfig } from 'wagmi';

function App() {
    return (
        <WagmiConfig config={wagmiConfig}>
            <HypertradeProvider apiKey="YOUR_API_KEY">
                <YourApp />
            </HypertradeProvider>
        </WagmiConfig>
    );
}

1. useQuote() — получение котировки

import { useQuote } from '@hypertrade/react-hooks';

function SwapInterface() {
    const [amountIn, setAmountIn] = useState('1000');

    const { 
        data: quote, 
        isLoading, 
        error 
    } = useQuote({
        tokenIn: 'USDC',
        tokenOut: 'ETH',
        amountIn,
        slippage: 1.0,
        enabled: amountIn !== '', // fetch только когда amount введён
    });

    if (isLoading) return <p>{t("Loading quote...")}</p>;
    if (error) return <p>{t("Error:")} {error.message}</p>;

    return (
        <div>
            <p>{t("You will receive:")} {quote.amountOutHuman} ETH</p>
            <p>{t("Price impact:")} {quote.priceImpact}%</p>
        </div>
    );
}

Features: • Автоматический refetch каждые 10 секунд • Debounce для amountIn (не спамит API при вводе) • Кеширование результатов

2. useSwap() — выполнение swap

import { useSwap } from '@hypertrade/react-hooks';

function SwapButton({ quote }) {
    const { 
        swap, 
        isSwapping, 
        isSuccess, 
        error 
    } = useSwap();

    const handleSwap = async () => {
        try {
            const result = await swap({
                tokenIn: 'USDC',
                tokenOut: 'ETH',
                amountIn: '1000',
                quote: quote.route,
            });

            console.log('Swap completed:', result);
            alert(`Received ${result.amountOut} ETH`);
        } catch (err) {
            console.error('Swap failed:', err);
        }
    };

    return (
        <button onClick={handleSwap} disabled={isSwapping}>
            {isSwapping ? t("Swapping...") : t("Swap")}
        </button>
    );
}

3. useApproval() — управление approvals

import { useApproval } from '@hypertrade/react-hooks';

function ApprovalButton({ token, amount }) {
    const { 
        needsApproval, 
        approve, 
        isApproving 
    } = useApproval(token, amount);

    if (!needsApproval) {
        return <p>{t("✅ Token approved")}</p>;
    }

    return (
        <button onClick={approve} disabled={isApproving}>
            {isApproving ? t("Approving...") : t("Approve USDC")}
        </button>
    );
}

4. useTokens() — список токенов

import { useTokens } from '@hypertrade/react-hooks';

function TokenSelector({ onSelect }) {
    const { data: tokens, isLoading } = useTokens();

    if (isLoading) return <p>{t("Loading tokens...")}</p>;

    return (
        <select onChange={(e) => onSelect(e.target.value)}>
            {tokens.map(token => (
                <option key={token.address} value={token.symbol}>
                    {token.symbol} - {token.name}
                </option>
            ))}
        </select>
    );
}

5. useBalance() — баланс токена

import { useBalance } from '@hypertrade/react-hooks';

function BalanceDisplay({ token }) {
  const { balance, isLoading } = useBalance(token);

  if (isLoading) return <p>{t("Loading balance...")}</p>;

  return (
    <p>{t("Balance:")} {balance} {token}</p>
  );
}

Best Practices для интеграции

1. Обработка ошибок

Всегда обрабатывайте возможные ошибки:

try {
  const quote = await hypertrade.getQuote({ ... });
} catch (error) {
  if (error.code === 'INSUFFICIENT_LIQUIDITY') {
    alert('Not enough liquidity for this swap');
  } else if (error.code === 'HIGH_PRICE_IMPACT') {
    alert(`Price impact ${error.impact}% is too high. Consider splitting the order.`);
  } else if (error.code === 'USER_REJECTED') {
    console.log('User cancelled transaction');
  } else {
    console.error('Unexpected error:', error);
    alert('Swap failed. Please try again.');
  }
}

Типичные коды ошибок:

2. UX рекомендации

✅ Показывайте loading states:

{isLoading && <Spinner />}
{quote && <QuoteDetails quote={quote} />}

✅ Показывайте детали маршрута:

<div className="route-details">
  <h4>{t("Route:")}</h4>
  {quote.route.map((hop, index) => (
    <div key={index}>
      {hop.percentage}% via {hop.dex} (impact: {hop.priceImpact}%)
    </div>
  ))}
</div>

✅ Показывайте экономию:

{quote.savings && (
  <p className="savings">
    💰 You save vs. single DEX
  </p>
)}

✅ Предупреждайте о high price impact:

{quote.priceImpact > 3 && (
  <Warning>
    ⚠️ High price impact ({quote.priceImpact}%). 
    Consider splitting your order. 
  </Warning>
)}

✅ Показывайте прогресс транзакции:

{isSwapping && (
  <div className="tx-progress">
    <Spinner />
    <p>{t("Swap in progress...")}</p>
    <p>{t("Transaction hash:")} {tx.hash}</p>
    <a href={`https://explorer.hyperliquid.xyz/tx/${tx.hash}`} target="_blank">
      View on Explorer
    </a>
  </div>
)}

3. Gas optimization

✅ Estimate gas перед выполнением:

const gasEstimate = await hypertrade.estimateGas({
  tokenIn: 'USDC',
  tokenOut: 'ETH',
  amountIn: amount,
});

console.log('Estimated gas cost:', gasEstimate.gasCostUSD, 'USD');

// Предупредить пользователя, если gas высокий
if (gasEstimate.gasCostUSD > 10) {
  const confirm = window.confirm(
    `Gas cost is high ($${gasEstimate.gasCostUSD}). Continue?`
  );
  if (!confirm) return;
}

✅ Batch approvals для нескольких токенов:

// Вместо отдельных approvals для каждого токена
const tokensToApprove = ['USDC', 'ETH', 'HYPE'];

const approvals = await Promise.all(
  tokensToApprove.map(token => hypertrade.approveToken(token, amount))
);

await Promise.all(approvals.map(tx => tx.wait()));
console.log('All tokens approved');

4. Security best practices

✅ Валидация пользовательского ввода:

function validateAmount(amount: string, decimals: number): boolean {
  // Проверка формата
  if (!/^\d+\.?\d*$/.test(amount)) {
    throw new Error('Invalid amount format');
  }

  // Проверка range
  const parsed = parseFloat(amount);
  if (parsed <= 0) {
    throw new Error('Amount must be positive');
  }
  if (parsed > 1e18) {
    throw new Error('Amount too large');
  }

  return true;
}

✅ Проверка contract address:

// Проверить, что tokenIn/tokenOut — это легитимные токены
const verifiedTokens = await hypertrade.getTokens();
const isTokenInVerified = verifiedTokens.some(t => t.symbol === tokenIn);
const isTokenOutVerified = verifiedTokens.some(t => t.symbol === tokenOut);

if (!isTokenInVerified || !isTokenOutVerified) {
  throw new Error('Token not verified');
}

✅ Rate limiting:

// Ограничение количества запросов от одного пользователя
import rateLimit from 'express-rate-limit';

const limiter = rateLimit({
  windowMs: 60 * 1000, // 1 минута
  max: 20, // максимум 20 запросов
  message: 'Too many requests, please try again later.',
});

app.use('/api/swap', limiter);

5. Аналитика и мониторинг

✅ Логирование swap событий:

const result = await hypertrade.executeSwap({ ... });

// Отправить событие в вашу аналитику

analytics.track('Swap Completed', {
  tokenIn: 'USDC',
  tokenOut: 'ETH',
  amountIn: '1000',
  amountOut: result.amountOut,
  priceImpact: result.priceImpact,
  gasCostUSD: result.gasCostUSD,
  savings: result.savings,
  userAddress: user.address,
  timestamp: Date.now(),
});

✅ Мониторинг ошибок:

try {
  await hypertrade.executeSwap({ ... });
} catch (error) {
  // Отправить в Sentry / error tracking
  Sentry.captureException(error, {
    tags: {
      component: 'swap',
      tokenIn: 'USDC',
      tokenOut: 'ETH',
    },
    user: { address: user.address },
  });

  throw error;
}

Referral Program: монетизация интеграции

Как это работает:

  1. Вы интегрируете Hypertrade в свой dApp
  2. Регистрируетесь в referral program: https://docs.hypertrade.io/referral
  3. Получаете referral code
  4. Передаёте referral code в каждом swap запросе
  5. Получаете % от объёма свапов, сделанных через ваш dApp

Пример интеграции:

const hypertrade = new HypertradeSDK({
  provider,
  signer,
  apiKey: 'YOUR_API_KEY',
  referralCode: 'YOUR_REFERRAL_CODE', // ваш уникальный код
});

// Все swaps автоматически засчитываются как ваши referrals
const tx = await hypertrade.executeSwap({ ... });

Условия программы:

  • Минимальный объём: $100,000/месяц
  • Комиссия: 0.05-0.15% от объёма (зависит от объёма)
  • Выплаты: ежемесячно в USDC или HYPE
  • Трекинг: real-time dashboard с аналитикой

Пример расчёта:

Ваш dApp генерирует $5M объёма swap/месяц
Комиссия: 0.1%
Ваш доход: $5,000/месяц ($60,000/год)

Подробнее: https://docs.hypertrade.io/referral

Примеры интеграции

Пример 1: DeFi Dashboard

Use case: пользователь хочет ребалансировать портфель (продать 30% ETH, купить USDC).

function PortfolioRebalance() {
  const [portfolio, setPortfolio] = useState({
    ETH: 10.5,
    USDC: 5000,
    HYPE: 2000,
  });

  const handleRebalance = async () => {
    // Продать 30% ETH
    const ethToSell = portfolio.ETH * 0.3; // 3.15 ETH

    const quote = await hypertrade.getQuote({
      tokenIn: 'ETH',
      tokenOut: 'USDC',
      amountIn: ethers.parseUnits(ethToSell.toString(), 18),
      slippage: 1.0,
    });

    console.log('Will receive:', quote.amountOutHuman, 'USDC');

    const tx = await hypertrade.executeSwap({
      tokenIn: 'ETH',
      tokenOut: 'USDC',
      amountIn: ethers.parseUnits(ethToSell.toString(), 18),
      slippage: 1.0,
    });

    await tx.wait();

    // Обновить портфель
    setPortfolio({
      ETH: portfolio.ETH - ethToSell,
      USDC: portfolio.USDC + parseFloat(quote.amountOutHuman),
      HYPE: portfolio.HYPE,
    });

    alert('Rebalance complete!');
  };

  return (
    <div>
      <h2>{t("Portfolio Rebalance")}</h2>
      <p>{t("ETH:")} {portfolio.ETH}</p>
      <p>{t("USDC:")} {portfolio.USDC}</p>
      <button onClick={handleRebalance}>{t("Rebalance (Sell 30% ETH)")}</button>
    </div>
  );
}

Пример 2: NFT Marketplace

Use case: пользователь хочет купить NFT за ETH, но у него только USDC.

function NFTPurchase({ nftPrice }) {
  const [userBalance, setUserBalance] = useState({ USDC: 5000, ETH: 0.5 });

  const handleBuyNFT = async () => {
    const ethNeeded = nftPrice; // например, 2.5 ETH

    if (userBalance.ETH >= ethNeeded) {
      // Достаточно ETH, можно покупать сразу
      await purchaseNFT(ethNeeded);
    } else {
      // Недостаточно ETH → swap USDC → ETH
      const ethShortage = ethNeeded - userBalance.ETH; // 2.0 ETH нужно докупить

      const quote = await hypertrade.getQuote({
        tokenIn: 'USDC',
        tokenOut: 'ETH',
        amountOut: ethers.parseUnits(ethShortage.toString(), 18), // reversed quote
        slippage: 1.0,
      });

      console.log('Need to swap:', quote.amountInHuman, 'USDC');

      // Подтверждение у пользователя
      const confirm = window.confirm(
        `You need ${ethShortage} ETH. Swap ${quote.amountInHuman} USDC?`
      );
      if (!confirm) return;

      // Выполнить swap
      const tx = await hypertrade.executeSwap({
        tokenIn: 'USDC',
        tokenOut: 'ETH',
        amountIn: quote.amountIn,
        slippage: 1.0,
      });

      await tx.wait();

      // Обновить баланс
      setUserBalance({
        USDC: userBalance.USDC - parseFloat(quote.amountInHuman),
        ETH: userBalance.ETH + ethShortage,
      });

      // Теперь купить NFT
      await purchaseNFT(ethNeeded);
    }
  };

  return (
    <div>
      <h2>{t("Buy NFT")}</h2>
      <p>{t("Price:")} {nftPrice} ETH</p>
      <p>{t("Your balance:")} {userBalance.ETH} ETH, {userBalance.USDC} USDC</p>
      <button onClick={handleBuyNFT}>{t("Buy NFT")}</button>
    </div>
  );
}

Пример 3: Trading Bot

Use case: автоматический DCA (Dollar Cost Averaging) — покупка ETH на $1000 каждый понедельник.

import cron from 'node-cron';

// Каждый понедельник в 10:00 UTC
cron.schedule('0 10 * * 1', async () => {
  console.log('Running weekly DCA...');

  try {
    const amountUSDC = 1000;

    const quote = await hypertrade.getQuote({
      tokenIn: 'USDC',
      tokenOut: 'ETH',
      amountIn: ethers.parseUnits(amountUSDC.toString(), 6),
      slippage: 1.0,
    });

    console.log('Will buy:', quote.amountOutHuman, 'ETH for', amountUSDC, 'USDC');
    console.log(', amountUSDC / parseFloat(quote.amountOutHuman), 'USDC/ETH');

    const tx = await hypertrade.executeSwap({
      tokenIn: 'USDC',
      tokenOut: 'ETH',
      amountIn: ethers.parseUnits(amountUSDC.toString(), 6),
      slippage: 1.0,
    });

    await tx.wait();
    console.log('DCA successful! Tx:', tx.hash);

    // Отправить уведомление
    await sendNotification(`DCA executed: Bought ${quote.amountOutHuman} ETH`);

  } catch (error) {
    console.error('DCA failed:', error);
    await sendErrorAlert('DCA failed', error);
  }
});

Troubleshooting: частые проблемы

Проблема 1: “Insufficient liquidity”

Причина: недостаточная ликвидность для ордера.

if (error.code === 'INSUFFICIENT_LIQUIDITY') {
  // Попробовать уменьшить ордер на 20%
  const newAmount = originalAmount * 0.8;
  const quote = await hypertrade.getQuote({ ...params, amountIn: newAmount });
}

Проблема 2: “High price impact”

Причина: ваш ордер слишком большой относительно ликвидности.

if (quote.priceImpact > 5) {
  console.warn('High price impact! Consider splitting order.');
  
  // Автоматическое разделение на 3 части
  const partSize = originalAmount / 3;
  
  for (let i = 0; i < 3; i++) {
    const tx = await hypertrade.executeSwap({ ...params, amountIn: partSize });
    await tx.wait();
    
    // Подождать 30 секунд перед следующей частью
    if (i < 2) await sleep(30000);
  }
}

Проблема 3: “Slippage exceeded”

Причина: цена изменилась между получением котировки и выполнением swap.

try {
  const tx = await hypertrade.executeSwap({ ...params, slippage: 1.0 });
} catch (error) {
  if (error.code === 'SLIPPAGE_EXCEEDED') {
    // Попробовать с увеличенным slippage
    console.log('Retrying with higher slippage...');
    const tx = await hypertrade.executeSwap({ ...params, slippage: 2.0 });
  }
}

Проблема 4: “Insufficient gas”

Причина: недостаточно HYPE для gas.

const hypeBalance = await provider.getBalance(userAddress);
const minHypeNeeded = ethers.parseUnits('5', 18); // минимум 5 HYPE

if (hypeBalance < minHypeNeeded) {
  alert('Insufficient HYPE for gas. Please add at least 5 HYPE to your wallet.');
  return;
}

Проблема 5: Rate limit exceeded

Причина: слишком много запросов к API.

import debounce from 'lodash.debounce';

// Debounce для избежания спама API
const debouncedGetQuote = debounce(async (params) => {
  const quote = await hypertrade.getQuote(params);
  setQuote(quote);
}, 500); // 500ms задержка

// При вводе пользователем
const handleAmountChange = (newAmount) => {
  setAmount(newAmount);
  debouncedGetQuote({ ...params, amountIn: newAmount });
};

Заключение: начните интеграцию сегодня

Преимущества интеграции Hypertrade:

  • ✅ 30-60 минут до первого работающего swap
  • ✅ 0% platform fee — вся экономия пользователям
  • ✅ Лучшие курсы на Hyperliquid (split-routing, Invisium)
  • ✅ Простой API — REST + TypeScript SDK + React hooks
  • ✅ Полная документация и примеры кода
  • ✅ Referral program — монетизация интеграции
  • ✅ Поддержка — Discord, email, Telegram

Следующие шаги:

  1. 📚 Изучите документацию: https://docs.hypertrade.io
  2. 🔑 Получите API key: https://docs.hypertrade.io/api-keys
  3. 💻 Установите SDK: npm install @hypertrade/sdk
  4. 🚀 Интегрируйте в свой dApp (используйте примеры выше)
  5. 🧪 Тестируйте на Hyperliquid testnet
  6. 🎉 Запускайте на mainnet

📚 Документация:

  • API Reference: https://docs.hypertrade.io/api
  • SDK Docs: https://docs.hypertrade.io/sdk
  • React Hooks: https://docs.hypertrade.io/react-hooks
  • Examples: https://github.com/hypertrade/examples

💬 Поддержка:

  • Discord (dev channel): https://discord.gg/hypertrade
  • Twitter: @Hypertrade_xyz
  • Email: developers@hypertrade.io
  • Telegram: @HypertradeDev

🎁 Referral Program:

  • Регистрация: https://docs.hypertrade.io/referral
  • Dashboard: https://app.hypertrade.io/referrals

💡 FAQ для разработчиков

Бесплатно ли использование API?

Да, публичный API бесплатен с ограничением 100 requests/minute. Для увеличенного лимита (1000 req/min) получите бесплатный API key.

Нужен ли мне backend для интеграции?

Нет, SDK работает полностью на frontend (в браузере). Backend нужен только для автоматических ботов или серверных интеграций.

Какие блокчейны поддерживаются?

Только Hyperliquid (HyperEVM, chainId 998). Поддержка других чейнов не планируется.

Могу ли я кастомизировать UI?

Да, SDK даёт полный контроль. Вы можете использовать готовый виджет или создать свой UI с нуля.

Как работает referral program?

Вы получаете 0.05-0.15% от объёма свапов, сделанных через ваш dApp. Минимальный объём: $100k/месяц. Выплаты ежемесячно.

Есть ли testnet?

Да, используйте Hyperliquid testnet для тестирования. API endpoint: https://api.hypertrade.io/v1/testnet

Могу ли я использовать API без SDK?

Да, REST API работает с любым языком (Python, Go, Rust, etc.). SDK — это просто удобная обёртка.

Как часто обновляется котировка?

API обновляет котировки в реальном времени (каждые 1-2 секунды). В SDK есть встроенный polling.

Что делать, если у меня проблема?

Напишите в Discord (#dev-support) или на developers@hypertrade.io. Среднее время ответа: 2-6 часов.

Есть ли примеры кода?

Да, смотрите https://github.com/hypertrade/examples — там 10+ примеров для разных use cases.

Integrating Hypertrade into Your dApp