> ## 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 クイックスタート

> Helius wallet-kit SDKをインストールし、1つのプロバイダーで埋め込みウォレットを接続

## インストール

npm (Node.js 18+) から [`helius-wallet-kit`](https://www.npmjs.com/package/helius-wallet-kit) をインストール:

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

必要なピア依存関係:

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

`next >= 14` は**オプション**のピアです — サーバールートハンドラーを使用する場合にインストールしてください。

## セットアップ

<Steps>
  <Step title="アプリをプロバイダーでラップ">
    クライアントコンポーネント内でアプリのルート付近に `HeliusWalletProvider` を追加し、Helius APIキーを渡します。それが唯一必要な設定で、SDKがプロジェクトIDとキーなしSecure RPC URLsを自動的に解決します。

    ```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>
      );
    }
    ```

    ダッシュボードでユーザーに表示するサインイン方法を選択します — [サインイン方法の設定](/ja/waas/configuration#configure-sign-in-methods)を参照してください。クライアントキーはブラウザで公開されているため、[RPCアクセス制御](/ja/rpc/protect-your-keys)を介してドメインにロックされたキーを使用してください。
  </Step>

  <Step title="スタイルをインポート">
    SDKスタイルシートをルートレイアウトに1回インポートします:

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

  <Step title="(オプション) サーバールートハンドラーを追加">
    デフォルトでは、SDKはプロジェクトのキーなしSecure RPC URLsを使用してブラウザから直接Heliusと通信します — サーバールートは必要ありません。RPC、送信、トランザクション履歴の呼び出しを独自のサーバーを通じてルーティングするには（および[送信者最適化ランディング](/ja/sending-transactions/sender)とトランザクション履歴を使用するには）、全てを受け入れるルートハンドラーを `/api/helius/[...path]` にマウントします。

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

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

    `HELIUS_API_KEY` をサーバー環境変数として設定し、ハンドラーが転送要求にそれを注入します。

    <Note>
      ウォレットの**ブートストラップ**は依然としてクライアント側であなたの`apiKey`を使用します — それはプロバイダー`config`に渡され、ブラウザから`/waas/config`に送信されます — したがって、ルートハンドラーを使用してもキーはブラウザに存在します。完全にサーバーサイドでのキー管理はロードマップに載っていますので、アプリのオリジンにスコープされた**ドメイン制限キー**を使用し、必要に応じてそれをローテーションしてください。
    </Note>
  </Step>
</Steps>

## 次のステップ

<CardGroup cols={2}>
  <Card title="構成" icon="sliders" href="/ja/waas/configuration">
    設定オプションとダッシュボードサインイン方法。
  </Card>

  <Card title="ウォレットの使用" icon="wallet" href="/ja/waas/using-the-wallet">
    認証状態の読み取り、署名、送信、履歴の読み取り。
  </Card>
</CardGroup>