AI Customer Support Chatbot

An AI-powered customer support chatbot built with a React frontend and Python/Flask backend, integrated with Anthropic's Claude API. Designed to handle customer queries in a natural, conversational way while staying focused on support-related topics.

---

Tech Stack

• Frontend: React (Vite)
• Backend: Python, Flask
• AI: Anthropic Claude API
• Other: Flask-CORS, python-dotenv

---

Features

• Real-time chat interface with a clean, minimal UI
• Customer support persona powered by Claude
• Conversation memory — the bot remembers context within a session
• Secure API key handling via environment variables (never exposed to the frontend)
• Mock response mode for development without an API key

---

Project Structure

ai-chatbot/
├── backend/
│   ├── app.py          # Flask server and Claude API integration
│   ├── .env            # API key (not committed to git)
│   └── requirements.txt
├── frontend/
│   ├── src/
│   │   ├── App.jsx     # Main chat UI component
│   │   └── App.css     # Styling
│   └── package.json

---

Getting Started

Prerequisites

• Python 3.10+
• Node.js (LTS)
• An Anthropic API key from console.anthropic.com

Backend Setup

cd backend
python -m venv venv
venv\Scripts\activate       # Windows
pip install flask flask-cors anthropic python-dotenv

Create a .env file in the backend folder:

ANTHROPIC_API_KEY=your-api-key-here

Run the server:

python app.py

The backend runs on http://127.0.0.1:5000.

Frontend Setup

cd frontend
npm install
npm run dev

The frontend runs on http://localhost:5173.

---

How It Works

1. The user types a message in the React chat UI
2. The frontend sends a POST request to the Flask /chat endpoint
3. Flask forwards the message (along with conversation history) to the Claude API
4. Claude's response is sent back to the frontend and displayed in the chat window

---

Environment Variables

Variable	Description
ANTHROPIC_API_KEY	Your Anthropic API key from console.anthropic.com

Never commit your .env file to git. Add it to .gitignore.

---

Author/Developer:

Ali — github.com/ali4xk