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

# WaaS Quickstart

> Instale o SDK do Helius wallet-kit e integre carteiras incorporadas com um provedor

## Instalação

Instale [`helius-wallet-kit`](https://www.npmjs.com/package/helius-wallet-kit) do npm (Node.js 18+):

```bash theme={"system"}
pnpm add helius-wallet-kit
```

Dependências peer obrigatórias:

* `react >= 18`
* `react-dom >= 18`
* `@solana/web3.js ^1.98`

`next >= 14` é um peer **opcional** — instale-o se você usar o manipulador de rota do servidor.

## Configuração

<Steps>
  <Step title="Envolva seu app no provedor">
    Adicione `HeliusWalletProvider` próximo à raiz do seu app em um componente cliente e passe sua chave de API Helius. Esta é a única configuração necessária — o SDK resolve seu ID do projeto e URLs Secure RPC sem chave automaticamente.

    ```tsx app/providers.tsx theme={"system"}
    "use client";

    import { HeliusWalletProvider } from "helius-wallet-kit";

    export function Providers({ children }: { children: React.ReactNode }) {
      return (
        <HeliusWalletProvider
          config={{
            apiKey: process.env.NEXT_PUBLIC_HELIUS_API_KEY!,
            cluster: "devnet",
          }}
        >
          {children}
        </HeliusWalletProvider>
      );
    }
    ```

    Você escolhe quais métodos de login seus usuários veem no painel — veja [Configurar métodos de login](/docs/pt-BR/waas/configuração#configure-sign-in-methods). Como a chave do cliente é exposta no navegador, restrinja-a aos seus domínios — veja [Protegendo sua chave](/docs/pt-BR/waas/securing-your-key).
  </Step>

  <Step title="Importe os estilos">
    Importe a folha de estilos do SDK uma vez, no layout raiz:

    ```tsx app/layout.tsx theme={"system"}
    import "helius-wallet-kit/ui/styles.css";
    ```
  </Step>

  <Step title="(Opcional) Adicione o manipulador de rota do servidor">
    Por padrão, o SDK se comunica com o Helius diretamente do navegador usando seus URLs Secure RPC sem chave do projeto — sem necessidade de rota de servidor. Para rotear suas chamadas de RPC, envio e histórico de transações através do seu próprio servidor (e para usar [Página de destino otimizada para remetente](/docs/pt-BR/sending-transactions/sender) e histórico de transações), monte o manipulador de rota abrangente em `/api/helius/[...path]`:

    ```ts app/api/helius/[...path]/route.ts theme={"system"}
    import { createHeliusRouteHandler } from "helius-wallet-kit/next";

    export const { GET, POST } = createHeliusRouteHandler();
    ```

    Defina `HELIUS_API_KEY` como uma variável de ambiente do servidor; o manipulador a injeta nessas solicitações encaminhadas.

    <Note>
      A **inicialização** da carteira ainda usa seu `apiKey` no lado do cliente — é passada
      para o provedor `config` e enviada para `/waas/config` do navegador — então
      a chave está presente no navegador mesmo com o manipulador de rota. Use uma
      **chave restrita por domínio** (defina origens permitidas na chave no seu
      painel), restrita à origem do seu app, e rotacione-a se necessário. O gerenciamento
      de chave totalmente no lado do servidor está no roadmap. Veja [Protegendo sua
      chave](/docs/pt-BR/waas/securing-your-key) para detalhes completos.
    </Note>
  </Step>
</Steps>

## Próximos passos

<CardGroup cols={2}>
  <Card title="Configuração" icon="sliders" href="/docs/pt-BR/waas/configuration">
    Opções de configuração e métodos de login do painel.
  </Card>

  <Card title="Usando a carteira" icon="wallet" href="/docs/pt-BR/waas/using-the-wallet">
    Leia o estado de autenticação, assine, envie e leia o histórico.
  </Card>
</CardGroup>