πŸ€– Local AI Chatbot - Complete Setup

🎯 What You Have

A fully functional AI chatbot that:

  • Runs 100% locally on your Mac (no cloud, no API costs)
  • Knows everything about you from your resume
  • Answers questions naturally using Llama 3.2
  • Works on your portfolio website
  • Costs $0 to run forever

πŸ“– Documentation Files

Start Here

  1. QUICK-START.md ⚑ - 3 commands to get running (START HERE!)
  2. SETUP-SUMMARY.md πŸ“‹ - Complete overview of what you got

Detailed Guides

  1. CHATBOT-README.md πŸ“š - Full chatbot documentation
  2. setup-local-llm.md πŸ”§ - Detailed Ollama setup instructions
  3. ARCHITECTURE.md πŸ—οΈ - How everything works together

Scripts & Tools

  1. start-chatbot.sh πŸš€ - Automated setup (run this!)
  2. test-chatbot.sh πŸ§ͺ - Verify everything works
  3. test-chatbot.html 🌐 - Standalone test page

πŸš€ Quick Start

# 1. Install Ollama
brew install ollama

# 2. Run setup
./start-chatbot.sh

# 3. Start website
python3 -m http.server 8000

Open: http://localhost:8000

That’s it! Click the chat icon (πŸ’¬) in bottom-right corner.

πŸ“ What Was Created

Core Files

  • chatbot.js - Chatbot logic with Ollama integration
  • chatbot.css - Beautiful chat widget styling
  • Modelfile - Your custom AI model with resume data

Updated Files

  • index.html - Added chatbot scripts

Setup Files

  • start-chatbot.sh - Automated setup
  • test-chatbot.sh - Testing script
  • test-chatbot.html - Test page

Documentation (9 files)

  • All the guides listed above

πŸ’¬ Try These Questions

Once running, ask the chatbot:

Skills

  • β€œWhat programming languages does Darya know?”
  • β€œTell me about Darya’s machine learning experience”

Research

  • β€œWhat research is Darya doing?”
  • β€œTell me about her work with Graph Neural Networks”

Projects

  • β€œWhat projects has Darya built?”
  • β€œTell me about the quantitative trading project”

General

  • β€œHow can I contact Darya?”
  • β€œIs Darya looking for internships?”

🎨 What It Looks Like

β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”
β”‚  Your Website                       β”‚
β”‚                                     β”‚
β”‚  [Your content here]                β”‚
β”‚                                     β”‚
β”‚                                     β”‚
β”‚                          β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β” β”‚
β”‚                          β”‚   πŸ’¬   β”‚ β”‚ ← Chat button
β”‚                          β””β”€β”€β”€β”€β”€β”€β”€β”€β”˜ β”‚
β””β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”˜

Click the button:

β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”
β”‚  Darya's AI Assistant        [Γ—]    β”‚
β”œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€
β”‚  Bot: Hi! Ask me anything about     β”‚
β”‚       Darya's skills and experience β”‚
β”‚                                     β”‚
β”‚  You: What are her technical skills?β”‚
β”‚                                     β”‚
β”‚  Bot: Darya has strong skills in    β”‚
β”‚       C++, Python, PyTorch...       β”‚
β”‚                                     β”‚
β”œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€
β”‚  [Type your message...]        [β†’]  β”‚
β””β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”˜

✨ Features

  • 🏠 100% Local - No cloud, no API
  • πŸ’° $0 Cost - Completely free
  • πŸ”’ Private - Data stays on your machine
  • ⚑ Fast - 1-2 second responses
  • πŸ“± Mobile Ready - Works on all devices
  • πŸŒ“ Theme Aware - Matches dark/light mode
  • 🎯 Smart - Trained on your resume
  • πŸ’¬ Natural - Conversational AI

πŸ”§ Customization

Update Your Info

# Edit Modelfile, then:
ollama create darya-assistant -f Modelfile

Change Appearance

Edit chatbot.css for colors, position, animations

Adjust AI Behavior

Edit Modelfile parameters:

  • temperature - Creativity (0.0-1.0)
  • num_ctx - Context window
  • top_p - Response diversity

πŸ§ͺ Testing

Option 1: Test Page

python3 -m http.server 8000
open http://localhost:8000/test-chatbot.html

Option 2: Command Line

ollama run darya-assistant
# Ask questions, type /bye to exit

Option 3: Automated

./test-chatbot.sh

❓ Troubleshooting

Chatbot not appearing?

  • Check browser console (F12)
  • Verify files loaded correctly

β€œOllama not running”?

ollama serve

Model not found?

ollama create darya-assistant -f Modelfile

Slow responses?

# Use smaller model
ollama pull llama3.2:3b

Still stuck?

./test-chatbot.sh  # Runs diagnostics

πŸ“Š Performance

Current Setup (Llama 3.2 3B)

  • Model Size: ~2GB
  • RAM Needed: 4GB min, 8GB recommended
  • Response Time: 1-2 seconds
  • Quality: Excellent

Alternative Models

# Faster
ollama pull phi3:3.8b

# Better quality
ollama pull llama3.1:8b

# Best quality (slower)
ollama pull llama3.1:70b

πŸ’° Cost

Your Setup (Local)

  • Installation: $0
  • Running: $0
  • Electricity: ~$0.01/hour
  • Total: FREE βœ…

Alternative (OpenAI)

  • GPT-3.5: ~$0.002/1K tokens
  • GPT-4: ~$0.03/1K tokens
  • Est: $10-50/month πŸ’Έ

πŸ” Privacy

βœ… All conversations stay on your machine βœ… No data sent to third parties βœ… No API keys needed βœ… Works offline βœ… Complete control

🌐 Deployment

Current: Local Only

Perfect for demos and development

Option: Deploy to Server

  1. Get VPS (DigitalOcean, AWS)
  2. Install Ollama on server
  3. Update endpoint in chatbot.js
  4. Add authentication

Option: Hybrid

  • Local for development
  • OpenAI for production

πŸ“š Learn More

  • Ollama: https://ollama.ai
  • Llama 3.2: https://ollama.ai/library/llama3.2
  • Models: https://ollama.ai/library

πŸ†˜ Support

Quick Checks

ollama ps              # Is it running?
ollama list            # List models
curl http://localhost:11434/api/tags  # Test API

Get Help

  1. Check CHATBOT-README.md
  2. Run ./test-chatbot.sh
  3. Check browser console (F12)
  4. Review setup-local-llm.md

🎯 Next Steps

  1. βœ… Read QUICK-START.md
  2. βœ… Run ./start-chatbot.sh
  3. βœ… Test with test-chatbot.html
  4. βœ… Try on your main website
  5. ⬜ Customize appearance
  6. ⬜ Update your info
  7. ⬜ Deploy (optional)

πŸŽ‰ You’re Ready!

Your AI chatbot is set up and ready to answer questions about your skills, experience, and projects!

To start:

./start-chatbot.sh
python3 -m http.server 8000

Then open http://localhost:8000 and click the chat icon! πŸš€


Questions? Check the documentation files above.

Issues? Run ./test-chatbot.sh for diagnostics.

Want to customize? Edit Modelfile and chatbot.css.

Status: βœ… Ready to use Cost: $0 Privacy: 100% local