Kvara AI — Marketing Assistant Bot

AI-powered marketing assistant built with TypeScript, Express, and React. Uses Claude (Anthropic) and Gemini (Google) APIs for intelligent marketing advice.

---

Features

Chat

• Text-based conversation with AI marketing assistant
• Real-time responses with typing indicator
• Message history within session
• Copy bot responses to clipboard

Voice

• Voice dialogue mode — speak directly with AI (Chrome/Edge)
• Text-to-Speech — listen to bot responses
• Speech-to-Text input in chat

AI Models

• Claude (Anthropic) — primary model with system prompt
• Gemini (Google) — free tier alternative for testing

System Prompt

• Pre-configured marketing specialist persona
• Knows: SEO, social media, content planning, branding, ad copywriting
• Responds in Georgian
• Restricted from sharing personal/financial information

---

Screenshots

Welcome Screen	Chat	Voice Dialogue

---

Tech Stack

Backend

• Node.js + Express
• TypeScript
• Anthropic SDK (Claude API)
• Google Generative AI SDK (Gemini API)
• dotenv — environment variables
• cors — cross-origin requests

Frontend

• React 19 + Vite
• TypeScript
• Web Speech API — voice input/output
• CSS — custom dark theme with green accents

---

Project Structure

ai-bot/
├── src/
│   ├── controllers/
│   │   └── chatController.ts    # Claude & Gemini API logic
│   ├── routes/
│   │   └── chatRoute.ts         # API endpoints
│   ├── prompts/
│   │   └── marketingPrompt.ts   # System prompt
│   ├── database/                # Future: chat history
│   └── index.ts                 # Express server
├── frontend/
│   ├── src/
│   │   ├── components/
│   │   │   ├── ChatMessage.tsx
│   │   │   ├── ChatInput.tsx
│   │   │   └── VoiceChat.tsx
│   │   ├── services/
│   │   │   └── api.ts
│   │   ├── styles/
│   │   ├── types/
│   │   └── App.tsx
│   └── vite.config.ts
├── .env
├── .gitignore
├── package.json
└── tsconfig.json

---

API Endpoints

Method	Endpoint	Description
POST	/api/claude	Send message to Claude AI
POST	/api/gemini	Send message to Gemini AI

Request Body

{
  "message": "SEO სტრატეგია მცირე ბიზნესისთვის"
}

Response

{
  "reply": "AI-ის პასუხი აქ..."
}

---

Setup

1. Clone

git clone https://github.com/Lussskki/AI-bot-typescript.git
cd ai-bot

2. Backend

npm install

Create .env file:

ANTHROPIC_API_KEY=sk-ant-your-key-here
GEMINI_API_KEY=AIzaSy-your-key-here

Start server:

npm run dev

3. Frontend

cd frontend
npm install
npm run dev

4. Open

• Frontend: http://localhost:5173
• Backend: http://localhost:3001

---

API Keys

Service	URL	Pricing
Claude (Anthropic)	console.anthropic.com	Paid ($5 min)
Gemini (Google)	aistudio.google.com	Free tier available

---

Browser Support

Feature	Chrome	Edge	Brave	Firefox	Safari
Chat	Yes	Yes	Yes	Yes	Yes
Voice Input	Yes	Yes	No	No	Partial
Voice Output	Yes	Yes	Yes	Yes	Yes

---

Author

Luka Guledani — Developer at Kvara Group

---