help@rskworld.in +91 93305 39277
RSK World
  • Home
  • Development
    • Web Development
    • Mobile Apps
    • Software
    • Games
    • Project
  • Technologies
    • Data Science
    • AI Development
    • Cloud Development
    • Blockchain
    • Cyber Security
    • Dev Tools
    • Testing Tools
  • Blog
  • About
  • Contact

Theme Settings

Color Scheme
Display Options
Font Size
100%
Back to Project
RSK World
anthropic-claude-chatbot
RSK World
anthropic-claude-chatbot
Anthropic Claude Chatbot - Python + Flask + Claude API + JavaScript + AI Chatbot + Conversational AI
anthropic-claude-chatbot
  • __pycache__
  • .env578 B
  • .gitignore669 B
  • ADVANCED_FEATURES.md6.6 KB
  • CHECKLIST.md3 KB
  • GITHUB_RELEASE_GUIDE.md4.6 KB
  • LICENSE1.3 KB
  • PROJECT_INFO.md2.2 KB
  • QUICK_START.md2.8 KB
  • README.md8.5 KB
  • RELEASE_NOTES.md6.6 KB
  • SETUP_ENV.md1.9 KB
  • TROUBLESHOOTING.md5.1 KB
  • advanced-features.js24.9 KB
  • app.py9.7 KB
  • config.py2.4 KB
  • env.example550 B
  • index.html11.4 KB
  • requirements.txt440 B
  • run.bat782 B
  • run.sh713 B
  • script.js21.2 KB
  • setup.py2.5 KB
  • start-frontend.bat683 B
  • start.bat1.6 KB
  • styles.css20.2 KB
.gitignoreQUICK_START.mdCHANGELOG.mdRELEASE_NOTES.mdTROUBLESHOOTING.md
.gitignore
Raw Download
Find: Go to:
# Anthropic Claude Chatbot - Git Ignore
# Project: Anthropic Claude Chatbot
# Year: 2026
#
# Developer Details:
# - Website: https://rskworld.in
# - Email: help@rskworld.in, support@rskworld.in
# - Phone: +91 93305 39277
# - Organization: RSK World

# Environment variables
.env
.env.local
.env.*.local

# Python
__pycache__/
*.py[cod]
*$py.class
*.so
.Python
build/
develop-eggs/
dist/
downloads/
eggs/
.eggs/
lib/
lib64/
parts/
sdist/
var/
wheels/
*.egg-info/
.installed.cfg
*.egg

# Virtual Environment
venv/
ENV/
env/
.venv

# IDE
.vscode/
.idea/
*.swp
*.swo
*~

# OS
.DS_Store
Thumbs.db

# Logs
*.log
logs/
58 lines•669 B
text
QUICK_START.md
Raw Download

QUICK_START.md

# Quick Start Guide - Fix "Failed to fetch" Error

**Developer Details:**
- Website: https://rskworld.in
- Email: help@rskworld.in, support@rskworld.in
- Phone: +91 93305 39277

---

## The Problem
You see this error when trying to chat:
```
Failed to fetch. Please check your API configuration.
```

## The Solution (3 Simple Steps)

### Step 1: Start the Backend Server

Open a terminal/command prompt in the project folder and run:

```bash
python app.py
```

**You should see:**
```
==================================================
Anthropic Claude Chatbot Server
==================================================
Starting server on http://0.0.0.0:5000
API Health Check: http://localhost:5000/api/health
✅ Anthropic API client initialized successfully
```

**⚠️ IMPORTANT:** Keep this terminal window open! The server must stay running.

---

### Step 2: Open HTML in a Web Server

**Don't double-click `index.html`!** Use one of these:

#### Option A: Python HTTP Server (Recommended)
Open a NEW terminal/command prompt and run:
```bash
python -m http.server 8000
```

Then open browser: `http://localhost:8000`

#### Option B: VS Code Live Server
1. Install "Live Server" extension
2. Right-click `index.html`
3. Click "Open with Live Server"

---

### Step 3: Check Status Indicator

In the chatbot interface, look at the top-right:
- ✅ Green "Ready" = Everything is working!
- ❌ Red "Server Offline" = Server not running (go back to Step 1)

---

## Still Not Working?

### Check 1: Is Server Running?
Open browser and go to: `http://localhost:5000/api/health`

You should see:
```json
{"status":"healthy","anthropic_configured":true}
```

If you see "This site can't be reached" → Server is NOT running (Step 1)

### Check 2: Is API Key Set?
1. Create `.env` file in project folder
2. Add this line:
```
ANTHROPIC_API_KEY=sk-ant-your-key-here
```
3. Get your key from: https://console.anthropic.com/
4. Restart the server (Step 1)

### Check 3: Port Conflict?
If port 5000 is busy, change it:
1. Edit `.env` file: `PORT=5001`
2. Edit `script.js` line 17: `const API_BASE_URL = 'http://localhost:5001/api';`
3. Restart server

---

## Complete Setup (First Time)

```bash
# 1. Install dependencies
pip install -r requirements.txt

# 2. Create .env file
copy env.example .env
# (Edit .env and add your ANTHROPIC_API_KEY)

# 3. Start Flask server (Terminal 1)
python app.py

# 4. Start HTTP server (Terminal 2)
python -m http.server 8000

# 5. Open browser
# Go to: http://localhost:8000
```

---

## Need More Help?

See `TROUBLESHOOTING.md` for detailed solutions.

**Contact:**
- Email: help@rskworld.in
- Website: https://rskworld.in

---

© 2026 RSK World. All rights reserved.

RELEASE_NOTES.md
Raw Download

RELEASE_NOTES.md

# Release Notes - Anthropic Claude Chatbot v1.0.0

**Release Date:** January 2026
**Developer:** RSK World
**Website:** https://rskworld.in
**Repository:** https://github.com/rskworld/anthropic-claude-chatbot

---

## 🎉 Version 1.0.0 - Initial Release

### Overview

This is the initial release of the Anthropic Claude Chatbot - a powerful, feature-rich chatbot interface integrated with Anthropic's Claude API. This release includes advanced conversational AI capabilities with a modern, user-friendly interface.

---

## ✨ Features

### Core Features
- ✅ **Claude API Integration** - Seamless integration with Anthropic's Claude API
- ✅ **Multiple Model Support** - Support for Claude 3.5 Sonnet, Opus, Sonnet, and Haiku
- ✅ **Long Context Support** - Handle extended conversations and context
- ✅ **Advanced Reasoning** - Leverage Claude's powerful reasoning capabilities
- ✅ **Safe AI Interactions** - Built-in safety features and content filtering
- ✅ **Multi-modal Support** - Support for text, images, and documents

### Advanced Features

#### 🎤 Voice Features
- **Voice Input** - Speech-to-text input using browser's Web Speech API
- **Voice Output** - Text-to-speech for Claude's responses
- **Multi-language Support** - Support for multiple languages in voice features
- **Auto Voice Output** - Automatic reading of assistant responses

#### 📎 File Handling
- **File Upload** - Upload images and documents for analysis
- **Image Analysis** - Claude's vision capabilities for image understanding
- **File Preview** - Preview files before sending
- **Multiple Formats** - Support for images (PNG, JPG, GIF), PDF, TXT, DOC, DOCX

#### 🎨 UI/UX Enhancements
- **Dark Mode** - Toggle between light and dark themes
- **Multiple Chat Sessions** - Create and manage unlimited chat sessions
- **Code Syntax Highlighting** - Beautiful code rendering with syntax highlighting
- **Markdown Rendering** - Full Markdown support (GitHub Flavored Markdown)
- **Responsive Design** - Works on desktop, tablet, and mobile devices

#### ⚡ Advanced Functionality
- **Streaming Responses** - Real-time token streaming for faster response display
- **Export Chat History** - Export conversations as PDF or TXT files
- **Chat Search** - Search through conversation history
- **Quick Templates** - Pre-built conversation templates for common tasks
- **API Usage Tracking** - Monitor token usage and API statistics
- **Settings Export/Import** - Save and restore your preferences
- **Message Reactions** - Like/unlike assistant responses
- **Copy Messages** - One-click copy for any message

---

## 📦 What's Included

### Frontend Files
- `index.html` - Main HTML interface
- `styles.css` - Complete styling with dark mode
- `script.js` - Frontend JavaScript functionality
- `advanced-features.js` - Advanced features module

### Backend Files
- `app.py` - Flask backend server
- `config.py` - Configuration management
- `setup.py` - Setup helper script

### Configuration
- `requirements.txt` - Python dependencies
- `env.example` - Environment variables template
- `.gitignore` - Git ignore rules

### Documentation
- `README.md` - Complete project documentation
- `PROJECT_INFO.md` - Project information
- `ADVANCED_FEATURES.md` - Feature documentation
- `QUICK_START.md` - Quick start guide
- `TROUBLESHOOTING.md` - Troubleshooting guide
- `SETUP_ENV.md` - Environment setup guide
- `CHECKLIST.md` - Project checklist
- `IMAGE_GENERATION_PROMPTS.md` - Image generation prompts

### Scripts
- `run.bat` / `run.sh` - Start scripts
- `start.bat` / `start-frontend.bat` - Complete startup scripts

---

## 🚀 Getting Started

### Prerequisites
- Python 3.8 or higher
- Anthropic API key ([Get one here](https://console.anthropic.com/))

### Installation

1. **Clone the repository**
```bash
git clone https://github.com/rskworld/anthropic-claude-chatbot.git
cd anthropic-claude-chatbot
```

2. **Install dependencies**
```bash
pip install -r requirements.txt
```

3. **Set up environment**
```bash
# Copy env.example to .env
cp env.example .env

# Edit .env and add your Anthropic API key
ANTHROPIC_API_KEY=your_api_key_here
```

4. **Start the server**
```bash
python app.py
```

5. **Open in browser**
- Use Python HTTP server: `python -m http.server 8000`
- Or use Live Server extension
- Open `http://localhost:8000`

---

## 🔧 Configuration

### Environment Variables
- `ANTHROPIC_API_KEY` - Your Anthropic API key (required)
- `FLASK_ENV` - Flask environment (development/production)
- `PORT` - Server port (default: 5000)
- `HOST` - Server host (default: 0.0.0.0)

### Frontend Configuration
Edit `script.js` to change API base URL if needed:
```javascript
const API_BASE_URL = 'http://localhost:5000/api';
```

---

## 📚 Documentation

Comprehensive documentation is available in the repository:
- **README.md** - Complete project documentation
- **QUICK_START.md** - Quick setup guide
- **TROUBLESHOOTING.md** - Common issues and solutions
- **ADVANCED_FEATURES.md** - Detailed feature documentation

---

## 🐛 Known Issues

None at this time. If you encounter any issues, please check `TROUBLESHOOTING.md` or open an issue on GitHub.

---

## 🔮 Future Enhancements

Potential features for future releases:
- Conversation sharing via URL
- Cloud sync for sessions
- Custom voice model selection
- Advanced file type support
- Integration with external tools
- Plugin system

---

## 📝 Changelog

### v1.0.0 (January 2026)
- Initial release
- All core and advanced features implemented
- Complete documentation
- Full test coverage

---

## 🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

---

## 📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

---

## 👥 Credits

**Developed by:**
- **RSK World** - https://rskworld.in
- **Founder:** Molla Samser
- **Designer & Tester:** Rima Khatun

**Contact:**
- Website: https://rskworld.in
- Email: help@rskworld.in, support@rskworld.in
- Phone: +91 93305 39277

---

## 🙏 Acknowledgments

- **Anthropic** - For providing the Claude API
- **Open Source Community** - For the amazing tools and libraries

---

## 📞 Support

For support, visit:
- **Documentation:** Check the README and other docs in the repository
- **Troubleshooting:** See TROUBLESHOOTING.md
- **Contact:** help@rskworld.in
- **Website:** https://rskworld.in

---

**© 2026 RSK World. All rights reserved.**

TROUBLESHOOTING.md
Raw Download

TROUBLESHOOTING.md

# Troubleshooting Guide

**Developer Details:**
- Website: https://rskworld.in
- Email: help@rskworld.in, support@rskworld.in
- Phone: +91 93305 39277
- Organization: RSK World

---

## Common Error: "Failed to fetch"

### Problem
When you try to send a message, you see:
```
Sorry, I encountered an error: Failed to fetch. Please check your API configuration.
```

### Solutions

#### 1. **Backend Server Not Running** (Most Common)

**Solution:** Start the Flask backend server first!

**Steps:**
```bash
# Navigate to project directory
cd path/to/anthropic-claude-chatbot

# Activate virtual environment (if using one)
# Windows:
venv\Scripts\activate
# Mac/Linux:
source venv/bin/activate

# Start the server
python app.py
```

You should see:
```
Starting Anthropic Claude Chatbot server on port 5000
* Running on http://0.0.0.0:5000
```

**Keep this terminal window open!** The server must be running for the chatbot to work.

---

#### 2. **Opening HTML File Directly**

**Problem:** If you open `index.html` directly in the browser (double-click), it will show this error.

**Solution:** Use one of these methods:

**Option A: Use Python HTTP Server**
```bash
# In the project directory, run:
python -m http.server 8000

# Then open in browser:
http://localhost:8000
```

**Option B: Use Live Server (VS Code Extension)**
- Install "Live Server" extension in VS Code
- Right-click on `index.html`
- Select "Open with Live Server"

**Option C: Use the Flask Server (Recommended)**
- Start Flask server: `python app.py`
- Open browser to: `http://localhost:5000` (if you serve HTML from Flask)
- Or use Python HTTP server on port 8000 as shown above

---

#### 3. **Port Already in Use**

**Problem:** Port 5000 is already being used by another application.

**Solution:**

**Option A: Change Flask Port**
Edit `.env` file:
```
PORT=5001
```

Then update `script.js`:
```javascript
const API_BASE_URL = 'http://localhost:5001/api';
```

**Option B: Stop Other Application**
```bash
# Windows - Find process using port 5000
netstat -ano | findstr :5000

# Kill the process (replace PID with actual process ID)
taskkill /PID <PID> /F

# Mac/Linux - Find and kill
lsof -ti:5000 | xargs kill
```

---

#### 4. **Firewall Blocking Connection**

**Problem:** Windows Firewall or antivirus blocking localhost connections.

**Solution:**
- Allow Python through Windows Firewall
- Temporarily disable antivirus to test
- Add exception for port 5000

---

#### 5. **API Key Not Configured**

**Problem:** Backend starts but API key is missing.

**Solution:**

1. Create `.env` file in project root (copy from `env.example`)
2. Add your Anthropic API key:
```
ANTHROPIC_API_KEY=sk-ant-your-api-key-here
```

3. Restart the Flask server

**Get API Key:**
- Visit: https://console.anthropic.com/
- Sign up or log in
- Create API key
- Copy and paste into `.env` file

---

#### 6. **CORS Issues**

**Problem:** Browser blocking cross-origin requests.

**Solution:**

The app already has CORS enabled. If still having issues:

1. Make sure `flask-cors` is installed:
```bash
pip install flask-cors
```

2. Verify CORS is enabled in `app.py`:
```python
from flask_cors import CORS
CORS(app)
```

---

## Quick Start Checklist

✅ **Step 1:** Install dependencies
```bash
pip install -r requirements.txt
```

✅ **Step 2:** Create `.env` file
```bash
cp env.example .env
# Edit .env and add your ANTHROPIC_API_KEY
```

✅ **Step 3:** Start Flask server
```bash
python app.py
```

✅ **Step 4:** Open HTML in browser
- Use Python HTTP server: `python -m http.server 8000`
- Or use Live Server extension
- Open `http://localhost:8000` in browser

✅ **Step 5:** Test connection
- Check status indicator in header (should show "Ready")
- Send a test message

---

## Testing Connection

### Test 1: Check Server Health
Open in browser: `http://localhost:5000/api/health`

Should return:
```json
{
"status": "healthy",
"anthropic_configured": true
}
```

### Test 2: Check Frontend Can Reach Backend
Open browser console (F12) and run:
```javascript
fetch('http://localhost:5000/api/health')
.then(r => r.json())
.then(console.log)
```

Should return the health check JSON.

---

## Still Having Issues?

1. **Check Server Logs**
- Look at the terminal where Flask is running
- Check for error messages
- Verify API key is loaded

2. **Check Browser Console**
- Press F12 to open Developer Tools
- Go to Console tab
- Look for error messages

3. **Check Network Tab**
- Open Developer Tools (F12)
- Go to Network tab
- Try sending a message
- Check if request to `/api/chat` shows error

4. **Verify File Paths**
- Make sure `index.html`, `script.js`, `advanced-features.js` are in same folder
- Check browser console for 404 errors on these files

---

## Contact Support

If none of these solutions work:
- **Email:** help@rskworld.in
- **Website:** https://rskworld.in
- **Phone:** +91 93305 39277

---

© 2026 RSK World. All rights reserved.

🚀 Support RSK World

Subscribe to our YouTube channel for latest tutorials & updates!



Click subscribe & support our work ❤️

About RSK World

Founded by Molla Samser, with Designer & Tester Rima Khatun, RSK World is your one-stop destination for free programming resources, source code, and development tools.

Founder: Molla Samser
Designer & Tester: Rima Khatun

Development

  • Game Development
  • Web Development
  • Mobile Development
  • AI Development
  • Development Tools

Legal

  • Terms & Conditions
  • Privacy Policy
  • Disclaimer

Contact Info

Nutanhat, Mongolkote
Purba Burdwan, West Bengal
India, 713147

+91 93305 39277

hello@rskworld.in
support@rskworld.in

© 2026 RSK World. All rights reserved.

Content used for educational purposes only. View Disclaimer