Restaurant Booking Bot - Project Documentation

📖 Project Overview

Restaurant Booking Bot is a comprehensive AI-powered platform designed to streamline restaurant management and enhance guest experiences. It features a sophisticated table reservation system, an interactive digital menu, and an AI chatbot that handles customer inquiries with ease. Built with Python, Flask, and SQLAlchemy, this project offers a modern, responsive design and robust backend logic. Perfect for restaurant owners looking to digitize their booking process and developers interested in building real-world AI applications.

⚡ Quick Facts

🎯 Type: AI Restaurant Management System

🤖 Key Features: Table Booking, Digital Menu, AI Chat, Admin Dashboard

⚡ Setup Time: ~5 minutes

📦 Backend: Python with Flask & SQLAlchemy

🎨 Frontend: HTML5, Vanilla CSS, JS

🧠 AI Model: OpenAI GPT-4o / Claude 3.5

📱 Platform: Web-based Responsive UI

🔧 Technologies: Python, Flask, SQLite, SQLAlchemy

25+

Files

5000+

Lines of Code

20+

Advanced Features

200K

Context Tokens

Developer: Molla Samser | Website: rskworld.in | Email: help@rskworld.in

Difficulty Level: Beginner/Intermediate - Designed for developers learning web development with Flask, database management with SQLAlchemy, and AI integration.

✨ Features

Core Features

📅 Table Reservation System

Smart booking logic with real-time availability checks, seating preferences, and automated confirmation emails.

📜 Digital Menu Browser

Beautifully categorized digital menu with high-quality images, pricing, and dietary information for guests.

🤖 AI Dining Assistant

Intelligent chatbot that recommends dishes based on flavor profiles and answers FAQ about the restaurant.

📊 Admin Dashboard

Comprehensive management tool for viewing reservations, updating menu items, and tracking customer sentiment.

Advanced Features

📧 Automated Notifications

Instant email and SMS confirmations for guests and real-time alerts for restaurant staff on new bookings.

🔍 Smart Search & Filters

Search dishes by name, category, or dietary tags (Vegan, Gluten-free) with real-time filtering.

💬 Sentiment-Aware Chat

The AI bot detects customer frustration or delight and adapts its tone accordingly to improve service.

🌙 Elegant Dark Mode

Premium dark-themed UI designed for low-light dining environments and a sophisticated look.

💾 Export Reservation Data

Export booking logs and customer preferences as CSV or PDF for marketing and management analysis.

🎨 Visual Table Map

Interactive restaurant layout allowing guests to select their preferred seating area visually.

🛠️ Technologies

Python

Powerful core language for backend logic and AI processing.

Language

Flask

Lightweight WSGI web application framework for Python.

Framework

SQLAlchemy

Object-Relational Mapper for efficient database interactions.

ORM

SQLite

Reliable, self-contained database engine for local storage.

Database

OpenAI / Claude

Large Language Models for the intelligent dining assistant.

AI API

Vanilla CSS

Modern glassmorphism UI built without heavy frameworks.

Styling

📦 Installation Guide - Step by Step

⏱️ Installation Time: ~5 minutes

Follow these simple steps to set up the Restaurant Booking Bot on your local environment.

📋 Prerequisites

🐍 Python 3.9+

Python 3.9 or higher is recommended for performance and compatibility.

Download: Python

🌐 SQLite

Pre-installed with Python, no separate database setup required.

🌐 AI API Key

Get your API key from OpenAI or Anthropic (required for AI Chat features).

🌐 Web Browser

A modern browser (Chrome, Firefox, Safari) for the Admin Dashboard.

🚀 Step-by-Step Installation

📌 Step 1: Download or Clone the Project

Option A: Download ZIP

Download the project ZIP file from the repository
Extract it to your desired location (e.g., C:\Projects\restaurant-booking-bot)
Navigate to the extracted folder

Option B: Clone with Git

git clone https://github.com/rskworld/restaurant-booking-bot.git
cd restaurant-booking-bot

✅ Step 2: Install Dependencies

Install the required Python packages using pip.

# Install required packages
pip install flask sqlalchemy flask-sqlalchemy

🔑 Step 3: Set Up API Keys

Configure your AI API key in the environment file.

Copy .env.example to .env
Edit .env and add your keys:
- OPENAI_API_KEY=sk-your-openai-key-here
Get your OpenAI API key from OpenAI Platform

🚀 Step 4: Run the Application

Start the Flask application to launch the booking system.

# Run the application
python app.py

🌐 Step 5: Open Frontend

Open the HTML file in your browser or use a local web server.

Method 1: Direct File Opening

Open index.html in your browser

Method 2: Using Local Web Server (Recommended)

# In a new terminal, start HTTP server
python -m http.server 8000

# Then open: http://localhost:8000

✅ Installation Complete!

Congratulations! You've successfully set up the Restaurant Booking Bot. The system is ready with all features including:

Interactive AI Chat for customer support and recommendations
Robust Table Reservation system with database persistence
Dynamic Digital Menu with categorization
Admin Dashboard for managing bookings and menu items
Real-time availability tracking
Responsive and premium dark-mode UI

Next Steps:

Access the web interface at http://localhost:5000
Create a test reservation to verify database functionality
Interact with the AI bot to test dish recommendations
Customize the menu via the admin configuration

🔧 Troubleshooting Installation

❌ database Error

Solution: Ensure models.py is correctly configured and the initial migration has run. SQLite will auto-create the .db file on first run.

❌ Flask Server Not Starting

Solution: Check Python version (3.9+), verify dependencies (Flask, SQLAlchemy) are installed. Ensure port 5000 is not blocked.

❌ API Key Issues

Solution: Verify your .env file has a valid OpenAI/Claude key. The AI Dining Assistant requires this for natural language processing.

❌ Frontend Connection

Solution: Verify the frontend is pointing to http://localhost:5000. Check CORS settings in app.py if accessing from a different domain.

📚 Usage Guide - Step by Step

🎯 Getting Started with Restaurant Booking Bot

Step-by-Step Usage Instructions

📝 Step 1: Start Backend Server

Run the Flask application: python app.py
Check if the server is up at http://localhost:5000
The database (SQLite) will be initialized automatically on the first request.

🌐 Step 2: Open Booking Interface

Access the web interface in your browser.
You should see the restaurant's home page with sections for:
- Hero Section: Catchy restaurant introduction
- Menu Section: Browse categories and dishes
- Reservation Form: Select date, time, and guests
- AI Chatbot: Floating bubble for instant help

💬 Step 3: Book a Table

Scroll to the Reservations section.
Enter your details (Name, Email, Date, Time, Special Requests).
Click Book Now.
The system will check availability and return a confirmation message.

🤖 Step 4: Interact with AI Assistant

Click the chat icon to ask questions like:

"What's the chef's special today?"
"Are there any vegan-friendly options on the menu?"
"Can I change my reservation for 4 to 6 people?"
"Do you have a kid-friendly menu?"

📊 Features Usage

📅 Real-time Booking

Submit reservations and get instant feedback on table availability based on capacity.

🍴 Menu Navigation

Explore categorized dishes with pricing, ingredients, and vibrant imagery.

🤖 AI Assistance

Get personalized dish recommendations and quick answers to restaurant FAQs.

🔧 Admin Control

Manage reservations and menu data through a secure administrative interface.

🤖 Claude API

Start chatting and Claude will respond with advanced reasoning and helpful answers

📎 File Upload

Upload images or documents for Claude to analyze and discuss

🎤 Voice I/O

Use microphone for voice input and text-to-speech for responses

💬 Multiple Sessions

Create separate chat sessions for different topics or projects

🎨 Code Highlighting

Code blocks automatically rendered with syntax highlighting

📝 Markdown

Rich text formatting with full markdown support

⚡ Streaming

Enable streaming for real-time token-by-token responses

📊 Usage Tracking

Monitor token usage, API costs, and conversation statistics

🚀 Advanced Features & Capabilities

The Restaurant Booking Bot includes advanced AI capabilities, table reservations, and management tools. Here's what you can do:

🧠 Intelligent Recommendations

Our AI Assistant uses natural language processing to understand guest preferences and recommend the perfect dish based on their mood or dietary needs.

📊 Operational Analytics

Track booking trends, peak dining hours, and popular menu items to optimize restaurant performance and staffing.

📱 Responsive UI

The system is fully optimized for mobile devices, allowing guests to book tables on-the-go with a premium liquid-smooth experience.

💻 Code Examples

Flask Backend - Table Reservation Route

                    # Python Flask backend - app.py
from flask import Flask, render_template, request, jsonify
from models import db, Reservation

app = Flask(__name__)
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///restaurant.db'
db.init_app(app)

@app.route('/api/book', methods=['POST'])
def book_table():
    data = request.json
    new_reservation = Reservation(
        name=data['name'],
        email=data['email'],
        date=data['date'],
        time=data['time'],
        guests=data['guests']
    )
    db.session.add(new_reservation)
    db.session.commit()
    return jsonify({'status': 'success', 'message': 'Table booked successfully!'})

if __name__ == '__main__':
    with app.app_context():
        db.create_all()
    app.run(debug=True)
                

SQLAlchemy Database Models

                    # Database Models - models.py
from flask_sqlalchemy import SQLAlchemy

db = SQLAlchemy()

class Reservation(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(100), nullable=False)
    email = db.Column(db.String(100), nullable=False)
    date = db.Column(db.String(20), nullable=False)
    time = db.Column(db.String(20), nullable=False)
    guests = db.Column(db.Integer, nullable=False)

class Dish(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(100), nullable=False)
    price = db.Column(db.Float, nullable=False)
    category = db.Column(db.String(50))
    image_url = db.Column(db.String(200))
                

AI Assistant Integration

                    # AI Recommendation Example
import openai

def get_dish_recommendation(user_prompt):
    response = openai.ChatCompletion.create(
        model="gpt-4",
        messages=[
            {"role": "system", "content": "You are a helpful restaurant assistant."},
            {"role": "user", "content": f"Recommend a dish for: {user_prompt}"}
        ]
    )
    return response.choices[0].message.content
                

🔗 Restaurant API Integration

Restaurant API Logic

The application uses a RESTful API powered by Flask to bridge the frontend and database. It handles secure reservation submissions, menu data retrieval, and AI-driven assistant responses.

Available APIs & Technologies

API/Technology	Type	Description
Flask REST API	Backend	Handles all reservation and menu requests.
SQLAlchemy ORM	Database	Manages SQLite data entries and queries.
OpenAI/Claude API	AI API	Powering the AI Dining Assistant.
LocalStorage	Browser API	Store settings and conversation history
Web Speech API	Browser API	Voice input/output (optional feature)

Backend API Endpoints

                    # Flask Backend - app.py
@app.route('/api/chat', methods=['POST'])
def chat():
    data = request.json
    message = client.messages.create(
        model=data.get('model', 'claude-3-5-sonnet-20241022'),
        max_tokens=data.get('max_tokens', 1024),
        temperature=data.get('temperature', 0.7),
        messages=[{"role": "user", "content": data['message']}]
    )
    return jsonify({
        'response': message.content[0].text,
        'usage': message.usage,
        'model': message.model
    })

@app.route('/api/health', methods=['GET'])
def health_check():
    return jsonify({
        'status': 'healthy',
        'anthropic_configured': bool(os.getenv('ANTHROPIC_API_KEY'))
    })
                

                    // Frontend JavaScript - API Integration
async function sendMessage(message) {
    try {
        const response = await fetch('http://localhost:5000/api/chat', {
            method: 'POST',
            headers: {'Content-Type': 'application/json'},
            body: JSON.stringify({
                message: message,
                model: 'claude-3-5-sonnet-20241022',
                max_tokens: 1024,
                temperature: 0.7,
                stream: false
            })
        });
        
        if (!response.ok) {
            throw new Error('API request failed');
        }
        
        const data = await response.json();
        return data.response;
    } catch (error) {
        console.error('Error:', error);
        return 'Error: ' + error.message;
    }
}
                

Browser Compatibility

                    // Check Claude API Connection
async function checkHealth() {
    try {
        const response = await fetch('http://localhost:5000/api/health');
        const data = await response.json();
        console.log('Server Status:', data.status);
        console.log('API Configured:', data.anthropic_configured);
        return data.anthropic_configured;
    } catch (error) {
        console.error('Health check failed:', error);
        return false;
    }
}

// Recommended setup:
// - Backend: Python 3.8+ with Flask
// - Frontend: Modern browsers (Chrome, Edge, Safari, Firefox)
// - Voice Features: Chrome/Edge for Web Speech API support
                

⚙️ Configuration

Configuration in this application is handled through environment variables and settings files:

Environment Variables

Create a .env file in the project root (copy from env.example):

                    # .env file
ANTHROPIC_API_KEY=sk-ant-your-api-key-here
FLASK_ENV=development
PORT=5000
                

Note: Get your API key from Anthropic Console. Never commit your .env file to version control.

Python Configuration (config.py)

The config.py file contains configuration settings:

                    # config.py
import os
from anthropic import Anthropic

class Config:
    ANTHROPIC_API_KEY = os.getenv('ANTHROPIC_API_KEY')
    DEFAULT_MODEL = 'claude-3-5-sonnet-20241022'
    DEFAULT_MAX_TOKENS = 1024
    DEFAULT_TEMPERATURE = 0.7
    
    # Initialize Anthropic client
    client = Anthropic(api_key=ANTHROPIC_API_KEY) if ANTHROPIC_API_KEY else None
                

Frontend Configuration

Edit script.js to configure API endpoint:

                    // script.js
const API_BASE_URL = 'http://localhost:5000/api';
const DEFAULT_MODEL = 'claude-3-5-sonnet-20241022';
const DEFAULT_MAX_TOKENS = 1024;
const DEFAULT_TEMPERATURE = 0.7;
                

Browser LocalStorage Settings

User settings are automatically saved to browser's local storage:

                    // Settings are saved automatically
localStorage.setItem('chatbotSettings', JSON.stringify({
    model: 'claude-3-5-sonnet-20241022',
    maxTokens: 1024,
    temperature: 0.7,
    stream: true,
    darkMode: false,
    autoSpeak: false
}));

// Load settings
const settings = JSON.parse(localStorage.getItem('chatbotSettings'));
                

Runtime Configuration

Configure settings through the web interface:

Model: Select Claude model (Sonnet, Opus, Haiku)
Max Tokens: Set maximum response length (1-4096)
Temperature: Control creativity (0-1, higher = more creative)
Stream: Toggle real-time streaming responses
Voice Settings: Configure voice input/output options
Dark Mode: Toggle between light and dark themes
Auto Speak: Toggle automatic text-to-speech

All settings are saved automatically and persist across browser sessions.

📁 Project Structure

restaurant-booking-bot

restaurant-booking-bot/
├── app.py              # Main Flask application with routes and logic
├── models.py           # SQLAlchemy database models for reservations and dishes
├── static/             # Static assets (CSS, images, JS)
│   ├── css/            # Style sheets
│   └── images/         # Menu and UI images
├── templates/          # HTML templates for the web interface
│   ├── index.html      # Main landing and booking page
│   └── admin.html      # Administration dashboard
├── requirements.txt    # Python dependencies
├── .env                # Environment variables (API keys, config)
├── LICENSE             # Project license
└── README.md           # Documentation and setup guide

Note: Edit config.py and .env to configure API settings and behavior.

📄 Detailed File Descriptions

🐍 app.py

Purpose: Main Flask backend server. Handles routing, API requests, and business logic for reservations.

Key Features:

Booking management routes
Menu API endpoints
AI Chatbot integration
Error handling and CORS

📊 models.py

Purpose: SQLAlchemy database models. Defines the structure for Reservations, Menu Items, and Users.

Key Features:

Relational database schema
Data validation logic
Automated SQLite initialization

🎨 templates/index.html

Purpose: The user-facing frontend. A dynamic landing page with booking and menu features.

Key Features:

Interactive reservation form
Digital menu display
AI Chatbot interface
Responsive design

📖 README.md

Purpose: Project overview and quick start guide. Provides introduction, features, installation instructions, and usage examples.

Contents:

Project description
Features list
Installation guide
Usage instructions
Browser compatibility
Support information

📝 RELEASE_NOTES.md

Purpose: Release notes. Documents features, changes, and updates in the current version.

Contents:

Release information
Feature list
Technical details
Changelog

⚖️ LICENSE

Purpose: License file. Contains the license text and copyright information.

License Type: MIT License

🚫 .gitignore

Purpose: Git ignore rules. Specifies files and directories that should not be tracked by version control.

Excluded Items:

IDE configuration files
OS-specific files
Log files
Build artifacts

📊 File Statistics

25+

Total Files

Core Files

Documentation Files

5000+

Lines of Code

20+

Advanced Features

200K

Context Tokens

📌 File Organization

Backend: app.py, models.py

Frontend: templates/, static/

Documentation: README.md, LICENSE

Configuration: .env, requirements.txt

Full-Stack: Python Flask + SQLAlchemy + AI API Integration

🚀 Advanced Features Details

1. AI-Powered Assistant

Intelligent chatbot using OpenAI/Claude to provide dish recommendations, answer restaurant FAQs, and handle reservation inquiries through natural conversation.

2. Smart Booking Logic

The system calculates table availability based on seating capacity, ensuring no overbooking and optimized dining floor management.

3. Digital Menu Management

Easy-to-use interface for restaurant owners to update dishes, prices, and descriptions in real-time without touching the code.

4. Sentiment Analysis

The chatbot monitors customer tone during interactions, allowing the restaurant to prioritize dissatisfied guests and improve service recovery.

5. Database Persistence

All reservations and menu data are stored securely in a local SQLite database using SQLAlchemy ORM for high performance and reliability.

🔧 Troubleshooting

API Key Issues

Ensure your .env file contains a valid ANTHROPIC_API_KEY starting with sk-ant-
Check that the API key is correctly formatted and not expired
Verify your API key has sufficient credits in Anthropic Console
Make sure the .env file is in the project root directory
Restart the Flask server after updating the API key

Flask Server Issues

Server not starting: Check Python version (3.8+), verify dependencies installed with pip install -r requirements.txt
Port 5000 in use: Change port in .env file or stop other applications using port 5000
Import errors: Ensure virtual environment is activated, reinstall dependencies
CORS errors: Verify Flask-CORS is installed and enabled in app.py
Connection refused: Check firewall settings, ensure server is running on correct port

Frontend Connection Issues

Failed to fetch: Ensure Flask server is running, check API_BASE_URL in script.js
CORS errors: Make sure Flask-CORS is installed and configured in backend
Server offline indicator: Check server status at http://localhost:5000/api/health
Port mismatch: Verify frontend API_BASE_URL matches backend port

Common Issues

API key not found: Create .env file from env.example and add your API key
Module not found: Install dependencies with pip install -r requirements.txt
Response errors: Check API key validity, verify credits, check Anthropic API status
File upload not working: Check file size limits, supported formats, and Flask file handling configuration
Streaming not working: Verify streaming is enabled in settings and backend supports streaming

📋 Requirements

                    Backend Requirements:
- Python 3.9 or higher
- Flask (Web Framework)
- SQLAlchemy (ORM)
- python-dotenv (Config)

Frontend Requirements:
- Modern Web Browser (Chrome, Edge, Safari, Firefox)
- Vanilla JavaScript & CSS3
- Responsive design principles

API Requirements:
- AI API Key (OpenAI or Claude)
- Internet connection for AI processing
                

Browser Compatibility: Chrome, Edge, Safari, or Firefox (Chrome/Edge recommended for voice features).

Python Version: Python 3.8 or higher required for backend server.

Internet Connection: Required for Claude API calls and CDN resources.

🎯 Use Cases

🏪 Restaurant Digitization

Perfect for small to medium restaurants looking to offer online booking.

📅 Reservation Management

Streamline the booking process and reduce manual errors with automated logic.

🤖 AI Customer Service

Automate guest inquiries about the menu, hours, and table availability.

📊 Business Growth

Analyze dining patterns to optimize staffing and marketing efforts.

📱 Mobile First Dining

Provide a premium, app-like experience for guests on their smartphones.

🍳 Kitchen Coordination

Better prepare the kitchen by knowing guest counts and special requests in advance.

💬 Support

For support, questions, or more projects:

Website: https://rskworld.in
Email: help@rskworld.in
Phone: +91 93305 39277

📄 License

This project is provided as-is for educational and development purposes.

MIT License - See LICENSE file for details.

📂 Demo Folder Structure

The demo/ folder contains demonstration and documentation files for this project.

                    demo/
├── index.html    # This comprehensive documentation page
├── demo.html     # Interactive demo interface for testing Claude chatbot
├── style.css     # CSS styling for documentation and demo
└── script.js     # JavaScript for scroll, navigation, and interactions
                

Try Interactive Demo

📄 Demo Files Description

📄 index.html

Purpose: Comprehensive project documentation and information page. This HTML file contains all details about the Anthropic Claude Chatbot project.

Contents:

Complete project overview
All features documentation
Installation instructions
Usage examples
Code examples
Claude API integration reference
Configuration details
Detailed file and folder descriptions
Project structure
Troubleshooting guide
Support information

Features:

Self-contained HTML with external CSS
Responsive design
Modern, beautiful UI
Well-organized sections
Easy navigation with smooth scrolling

🎨 style.css

Purpose: CSS stylesheet file with modern styling for the documentation page.

Features:

Modern gradient backgrounds
Responsive design
Beautiful typography
Smooth animations
Sticky navigation
Scroll progress bar

📜 script.js

Purpose: JavaScript file with interactive features for the documentation page.

Features:

Scroll progress bar
Back to top button
Smooth scrolling navigation
Active navigation highlighting
Copy to clipboard functionality

🎮 demo.html

Purpose: Interactive demo interface showcasing the Restaurant Booking Bot's AI features.

Features:

Interactive chat interface
Sample Restaurant Assistant responses
Quick action buttons (Book table, FAQs)
Beautiful, responsive UI

Usage: Open demo.html in your browser to try the interactive demo!

💡 About the Demo Folder

The demo/ folder contains demonstration and documentation files for the Anthropic Claude Chatbot project:

Documentation: index.html - Comprehensive guide for the Restaurant Booking Bot project
Interactive Demo: demo.html - Live preview of the AI Dining Assistant
Styling: style.css - Modern restaurant-themed stylesheet
Scripts: script.js - Logic for smooth documentation navigation

Note: To view the documentation, open demo/index.html in your browser. To try the interactive demo, open demo.html. Both pages are self-contained and work independently.