# Руководство по JavaScript

### Начало работы

Если вы начинаете с нуля, мы рекомендуем вам начать с использования пустого проекта Vite Typescript, выполнив следующие команды

```
yarn create vite YOUR-APP-NAME --template react-ts && yarn install
```

Установите зависимости проекта

```
yarn add @sei-js/react // or npm install @sei-js/react
```

{% hint style="info" %}
Если вы не пользуетесь React для разработки кода, вам необходимо использовать основную библиотеку JS [NPM Packages](https://seinetwork.gitbook.io/docs/front-end-development/npm-packages)
{% endhint %}

### Подключение кошелька

Для взаимодействия с блокчейном вам нужна автономная подписывающая сторона. Хук useWallet позволяет вам подключить предопределённых провайдеров кошельков, чтобы получить автономную подписывающую сторону, также он содержит другие полезные функции и константы.

Официально Sei поддерживает следующие кошельки, один из них будет необходим для разработки вашего интерфейса.

* Leap for Cosmos <https://www.leapwallet.io/>
* Keplr <https://www.keplr.app/download>
* Falcon <https://www.falconwallet.app/>
* Coin98 <https://coin98.com/wallet>

```
import { useWallet } from '@sei-js/react';

const { connectedWallet, offlineSigner } = useWallet(window, { inputWallet: "leap", autoconnect: true, chainConfiguration: 'testnet' })
```

{% hint style="info" %}
Результат использования хука useWallet может быть сохранен в инструменте recoil atom для использования с другими компонентами, но тогда будет необходим флаг  dangerouslyAllowMutability.

```
export const seiWalletAtom = atom({
   key: 'seiWallet',
   default: {},
   dangerouslyAllowMutability: true
});
```

{% endhint %}

#### Подключение пользовательского узла

Если вам необходимо подключиться к локальной ноде или локальному RPC, вы можете использовать пользовательские данные restUrl, rpcUrl и chainId.

```
import { useWallet } from '@sei-js/react';

const { connectedWallet, offlineSigner } = useWallet(window, { inputWallet: "leap", autoconnect: true, chainConfiguration: { chainId: 'atlantic-1', restUrl: '', rpcUrl: ''})
```

### Клиент для  запросов

Чтобы запрашивать данные через RPC, вам нужен queryClient, подключенный к RPC.

```
import { useQueryClient } from '@sei-js/react';

const { restUrl } = useWallet(window, { inputWallet: "leap", autoconnect: true, chainConfiguration: 'testnet' })
const { queryClient, accounts } = useQueryClient(restUrl)

//Query balances
const { balances } = await queryClient.cosmos.bank.v1beta1.allBalances({ address: accounts[0].address })
```

### Клиент для подписи

Для подписания транзакций или исполнения контрактов вам нужен клиент для подписи. Используя автономную подпись и rpcUrl из хука useWallet, вы можете легко получить клиент для подписи для вашего подключенного кошелька.

#### Перевод токенов

```
import { useWallet, useSigningClient } from '@sei-js/react';
import { calculateFee, GasPrice } from '@cosmjs/stargate';

const { rpcUrl, offlineSigner, accounts } = useWallet(window, { inputWallet: "leap", autoconnect: true, chainConfiguration: 'testnet' });
const { signingClient } = useSigningClient(rpcUrl, offlineSigner);

const fee = calculateFee(150000, GasPrice.fromString('3750usei'));
const transferAmount = { amount: SEND_AMOUNT, denom: TOKEN_DENOM };

const sendResponse = await signingClient.sendTokens(accounts[0], DESTINATION_ADDRESSS, [transferAmount], fee);
```

#### Перевод через IBC

Переводы через IBC требуют наличия мостов и наличия id канала назначения до начала операции перевода.&#x20;

```
import { useWallet, useSigningClient } from '@sei-js/react';
import { calculateFee, GasPrice } from '@cosmjs/stargate';

const { rpcUrl, offlineSigner, accounts } = useWallet(window, { inputWallet: "leap", autoconnect: true, chainConfiguration: 'testnet' });
const { signingClient } = useSigningClient(rpcUrl, offlineSigner);

const fee = calculateFee(150000, GasPrice.fromString('3750usei'));
const transferAmount = { amount: SEND_AMOUNT, denom: TOKEN_DENOM };

const ibcResponse = await signingClient.sendIbcTokens(accounts[0].address, DESTINATION_ADDRESSS, transferAmount, 'transfer', CHANNEL_ID, undefined, undefined, fee)
```

#### Исполнение контракта (минт)

```
import { useWallet, useSigningClient } from '@sei-js/react';

const { rpcUrl, offlineSigner, accounts } = useWallet(window, { inputWallet: "leap", autoconnect: true, chainConfiguration: 'testnet' });
const { signingClient } = useSigningClient(rpcUrl, offlineSigner);

const account = accounts[0];
const mintMsg = { mint: {} };

const msg = {
            typeUrl: "/cosmwasm.wasm.v1.MsgExecuteContract",
            value: {
                sender: account.address,
                contract: CONTRACT_ADDR,
                msg: toUtf8(JSON.stringify(mintMsg)),
                funds: [],
            }
 }

const result = await signingClient.signAndBroadcast(account.address, [msg], fee);
```