# Wallet Playground

This example is the front-end interface for the Crypto.com Wallet Playground, built using React, Vite, and TypeScript. It provides a simple UI to create wallets using the official Crypto.com Developer Platform SDK.

### Features

* Simple wallet creation using the Crypto.com Developer SDK
* Displays:
  * Wallet address
  * Private key
  * Mnemonic phrase
* Clean, dark-themed UI with styled components

<div data-full-width="false"><figure><img src="/files/88oPzv9zk9Jz4O9CA2QQ" alt=""><figcaption></figcaption></figure></div>

### Installation

Navigate to the app folder and install dependencies:

```sh
cd developer-platform-sdk-examples/sdk-examples/categories/wallet
npm install
```

### Environment Variables

This example uses a client-side SDK and may require an API key. You can initialize the SDK inside your app (`src/app/Wallet/index.tsx`) code like so:

```typescript
import { Client } from '@crypto.com/developer-platform-client';

Client.init({
  apiKey: 'your-crypto.com-developer-platform-api-key',
});
```

{% hint style="info" %}
For Crypto.com Developer Platform API Key, [click here to learn how to obtain your Crypto.com Developer Platform API key](/crypto.com-developer-platform/developer-platform-dashboard.md).
{% endhint %}

{% hint style="info" %}
**Note:** Never expose real or production API keys in a public or client-side app.
{% endhint %}

### Usage

To run the app in development mode:

```sh
npm run dev
```

Open your browser at `http://localhost:5173`.

### Build

To generate a production-ready build:

```sh
npm run build
```

To preview the build:

```sh
npm run preview
```

### Demo Video

{% embed url="<https://files.gitbook.com/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FktUMyU5bBece2vVjrTg7%2Fuploads%2FAmHjrKmmYJ8L4begeTLe%2FWalletDemo.mp4?alt=media&token=5efe87b7-83e7-4a1e-a5f5-ae66b747644c>" %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://ai-agent-sdk-docs.crypto.com/crypto.com-developer-platform/developer-platform-client-sdk-examples/wallet-playground.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.