# AI Agent Chatbot

The [Crypto.com AI Agent Chatbot](https://github.com/crypto-com/developer-platform-sdk-examples/tree/main/sdk-examples/categories/chatbot) is an example of an application built with the suite of AI Agent SDK tools, demonstrating how to build a chatbot app that allows users to interact with blockchain services with natural language.

This example contains both the **AI-powered chatbot backend** (Flask server) and the **React frontend** (Vite app) for interacting with the chatbot.

### Structure

```markdown
├── README.md                # Monorepo root guide
├── ai-chatbot-server/       # Python Flask backend
│   └── README.md
├── ai-chatbot-app/          # React + Vite frontend
│   └── README.md
```

### Installation

#### 1. Clone the repository

```
git clone https://github.com/crypto-com/developer-platform-sdk-examples.git
cd developer-platform-sdk-examples/sdk-examples/categories/chatbot
```

#### 2. Backend setup (Python)

```python
cd ai-chatbot-server
python -m venv venv
source venv/bin/activate  # or .\venv\Scripts\activate on Windows
pip install -r requirements.txt
```

#### 3. Frontend setup (React + Vite)

```
cd ../ai-chatbot-app
npm install
```

#### 4. Config environment variables

Create `ai-chatbot-server/.env` 

```
OPENAI_API_KEY=your-openai-api-key
SDK_API_KEY=your-sdk-api-key        // Your Crypto.com Developer Platform API key
PRIVATE_KEY=your-wallet-private-key
AI_CHATBOT_APP_URL=http://localhost:5173
```

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

Create `ai-chatbot-app/.env`

```
VITE_CHATBOT_SERVER_BASE_URL=http://localhost:5000
```

### Usage

#### Start the backend (Flask)

```bash
cd ai-chatbot-server
flask run
```

This will start the Flask server at `http://localhost:5000` 

#### Start the frontend (Vite)

```bash
cd ai-chatbot-app
npm run dev
```

This will start the React app at `http://localhost:5173` 

### Demo Video

{% embed url="<https://files.gitbook.com/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FktUMyU5bBece2vVjrTg7%2Fuploads%2FDEObFXhm6qLmxKgH9ZJI%2FAI%20Agent%20Chatbot%20Demo.mp4?alt=media&token=18ab6cad-57b5-444c-86b8-2192808f6caf>" %}