SETUP.md

Customer Agent SaaS - Complete Setup Guide

🚀 Quick Start (Development)

Prerequisites

• Node.js 18+
• Python 3.11+
• PostgreSQL
• OpenAI API Key

1. Backend Setup

cd server
pip install -r requirements.txt
cp .env.example .env
# Edit .env with your credentials
uvicorn app.main:app --reload --port 8000

2. Frontend Setup

cd client
npm install
npm run dev

3. Database Setup

CREATE DATABASE customeragent;

🔧 Configuration

Environment Variables (.env)

DATABASE_URL=postgresql://user:password@localhost/customeragent
SECRET_KEY=your-secret-key-here
OPENAI_API_KEY=sk-your-openai-key
GOOGLE_CLIENT_ID=your-google-oauth-client-id
GOOGLE_CLIENT_SECRET=your-google-oauth-secret
SMTP_HOST=smtp.gmail.com
SMTP_PORT=587
SMTP_USER=your-email@gmail.com
SMTP_PASSWORD=your-app-password

📋 Features Implemented

✅ Core Features

• JWT Authentication with httpOnly cookies
• Google OAuth integration
• Website management dashboard
• Script verification system
• Sitemap-based content scraping
• NumPy-optimized vector operations
• FAISS vector database
• AI-powered chat responses
• Agentic owner contact system
• Email notifications
• Real-time WebSocket chat
• Embeddable widget
• React Query for state management
• Framer Motion animations
• Tailwind CSS styling

🎯 Workflow

1. User Registration → Secure JWT auth
2. Add Website → Domain verification
3. Install Script → Verification check
4. Fetch Content → Sitemap scraping
5. Process AI → Vector embeddings
6. Live Chat → AI responses + owner escalation

🌐 Deployment

Frontend (Vercel/Netlify)

npm run build
# Deploy dist/ folder

Backend (Render/Railway)

# Use start.sh as entry point
./start.sh

Environment Variables (Production)

DATABASE_URL=postgresql://...
SECRET_KEY=production-secret-key
OPENAI_API_KEY=sk-...
FRONTEND_URL=https://your-domain.com
BACKEND_URL=https://api.your-domain.com

🔗 API Endpoints

Authentication

• POST /auth/register - User registration
• POST /auth/login - User login
• POST /auth/logout - User logout
• GET /auth/me - Current user info

Websites

• GET /websites/ - List user websites
• POST /websites/ - Add new website
• POST /scrape/{id}/verify-script - Verify widget installation
• POST /websites/{id}/fetch-content - Scrape content
• POST /scrape/{id}/process-content - Create embeddings

Chat & Actions

• POST /chat/ - Send chat message
• POST /actions/contact-owner - Contact website owner
• WS /ws/{website_id} - WebSocket chat

🎨 Widget Integration

Add to any website:

<script src="https://your-domain.com/static/widget.js" data-website-id="123"></script>

🔒 Security Features

• httpOnly JWT cookies (XSS protection)
• CORS with specific origins
• Password hashing (bcrypt)
• SQL injection protection (SQLAlchemy)
• Input validation (Pydantic)
• Secure cookie settings

📊 Tech Stack Summary

Frontend: React + Vite + Tailwind + Framer Motion + React Query Backend: FastAPI + NumPy + FAISS + PostgreSQL + WebSockets AI: OpenAI GPT-3.5 + Vector Similarity Search Auth: JWT + Google OAuth + httpOnly Cookies Deployment: Vercel + Render/Railway

🎯 Production Checklist

• Update CORS origins in main.py
• Set strong SECRET_KEY
• Configure production database
• Set up SMTP for emails
• Configure Google OAuth
• Test widget on live site
• Monitor vector database performance
• Set up error tracking

🚀 Next Steps

1. Scale Vector DB: Implement ChromaDB for larger datasets
2. Analytics: Add chat analytics dashboard
3. Multi-language: Support multiple languages
4. Custom Branding: White-label widget options
5. Advanced AI: Fine-tune models on website content