Simple Chatbot for Pipecat Cloud

This project demonstrates how to build a complete Pipecat AI agent application with both client and server components. It includes a Next.js client for interacting with a Pipecat AI bot server through Daily.co's WebRTC transport.

Project Overview

• Server: Python-based Pipecat bot with video/audio processing capabilities
• Client: Next.js TypeScript web application using the Pipecat React & JS SDKs
• Infrastructure: Deployable to Pipecat Cloud (server) and Vercel (client)

See the simple-chatbot example with different client and server implementations.

Quick Start (Local run)

1. Server Setup

Navigate to the server directory:

cd server

Create and activate a virtual environment:

python3 -m venv venv
source venv/bin/activate  # On Windows: venv\Scripts\activate

Install requirements:

pip install -r requirements.txt

Copy env.example to .env and add your API keys:

cp env.example .env
# Edit .env to add OPENAI_API_KEY, CARTESIA_API_KEY, and DAILY_API_KEY

Run the server locally to test before deploying:

python server.py

You can join this client via Daily's Prebuilt UI at http://localhost:7860 or follow step 2 to join from the simple-chatbot client.

2. Client Setup

In a separate terminal, navigate to the client directory:

cd client-react

Install dependencies:

npm install

Create .env.local file and add your PIPECAT_CLOUD_API_KEY:

cp env.local.example .env.local

Create a Pipecat Cloud API public key using the dashboard. This key is still a secret, so protect it. It's meant to launch your Pipecat apps.

Run the client app:

npm run dev

Open http://localhost:3000 to interact with your agent through the Next.js client.

Deployment

See the Pipecat Cloud Quickstart for a complete walkthrough.

Deploy Server to Pipecat Cloud

1. Install the Pipecat Cloud CLI:

pip install pipecatcloud

2. Authenticate:

pcc auth login

3. Build and push your Docker image:

cd server
chmod +x build.sh
./build.sh

IMPORTANT: Before running this build script, you need to add your DOCKER_USERNAME

4. Create a secret set for your API keys:

pcc secrets set simple-chatbot-secrets --file .env

5. Deploy to Pipecat Cloud:

pcc deploy

IMPORTANT: Before deploying, you need to add your Docker Hub username

Deploy Client to Vercel

1. Push your Next.js client to GitHub

2. Connect your GitHub repository to Vercel

3. Add your PIPECAT_CLOUD_API_KEY and AGENT_NAME environment variable in Vercel

4. Deploy with the Vercel dashboard or CLI

Project Structure

simple-chatbot/
├── client-next/            # Next.js client application
│   ├── src/
│   │   ├── app/            # Next.js app routes
│   │   │   └── api/
│   │   │       └── connect/ # API endpoint for Daily.co connection
│   │   ├── components/     # React components
│   │   └── providers/      # React providers including RTVIProvider
│   ├── package.json
│   └── README.md          # Client-specific documentation
│
└── server/                # Pipecat bot server
    ├── assets/            # Robot animation frames
    ├── bot.py             # The Pipecat pipeline implementation
    ├── Dockerfile         # For building the container image
    ├── build.sh           # Script for building and pushing Docker image
    ├── requirements.txt   # Python dependencies
    ├── pcc-deploy.toml    # Pipecat Cloud deployment config
    ├── runner.py          # Local dev only: A runner that launches
    ├── server.py          # Local dev only: A FastAPI server to handle inbound requests
    └── README.md          # Server-specific documentation