Skip to content

SETUP.md

Latest commit

 

History

History
165 lines (125 loc) · 4.23 KB

SETUP.md

File metadata and controls

165 lines (125 loc) · 4.23 KB

🚀 Smart Study Assistant - Setup Guide

Quick Fix for 500 Error

The 500 error was caused by incorrect Gemini API configuration. Here's what was fixed:

✅ Issues Fixed:

  1. Gemini API Import: Changed from @google/genai to @google/generative-ai
  2. API Key Configuration: Updated to use the new API key
  3. API Call Structure: Fixed the model initialization and content generation
  4. Error Handling: Added proper error handling and connection status
  5. UI/UX Improvements: Modern glassmorphism design with better user experience

🛠️ Setup Instructions

1. Backend Setup

cd backend
npm install

Install the correct Gemini package:

npm uninstall @google/genai
npm install @google/generative-ai

Test the API connection:

node test-api.js

Start the backend server:

npm start
# or for development
npm run dev

The backend will run on http://localhost:3000

2. Frontend Setup

cd frontend
npm install
npm run dev

The frontend will run on http://localhost:5173

3. Environment Configuration

Backend (.env):

GEMINI_API_KEY=API_key

Frontend (.env):

VITE_API_URL=http://localhost:3000

🔧 API Endpoints

  • POST /chat/zero-shot - Zero-shot prompting
  • POST /chat/one-shot - One-shot prompting with examples
  • POST /chat/multi-shot - Multi-shot prompting with multiple examples
  • POST /chat/chain-of-thought - Chain of thought reasoning
  • GET /chat/types - Get available prompt types

🎨 UI/UX Improvements

New Features:

  • Connection Status Indicator: Shows real-time backend connection status
  • Modern Design: Glassmorphism effects with blue gradient theme
  • Better Loading States: Animated spinners and loading indicators
  • Enhanced Sidebar: Icons, descriptions, and smooth animations
  • Error Handling: User-friendly error messages with retry options
  • Responsive Design: Works on all screen sizes

Visual Enhancements:

  • 🎯 Icons for each prompting strategy
  • 🌊 Smooth hover animations and transitions
  • 💎 Glassmorphism cards and containers
  • 🎨 Modern blue color scheme
  • ⚡ Real-time connection status
  • 🔄 Loading animations

🚀 Deployment

Backend (Render/Railway/Vercel)

  1. Push code to GitHub
  2. Connect to deployment platform
  3. Set environment variable: GEMINI_API_KEY
  4. Deploy

Frontend (Vercel/Netlify)

  1. Update VITE_API_URL in .env to your backend URL
  2. Build and deploy
  3. Set environment variable in deployment platform

🧪 Testing

Test individual components:

# Test zero-shot prompting
curl -X POST http://localhost:3000/chat/zero-shot \
  -H "Content-Type: application/json" \
  -d '{"message": "What is photosynthesis?"}'

# Test connection
curl http://localhost:3000/chat/types

🐛 Troubleshooting

Common Issues:

  1. 500 Error: Usually API key or import issues

    • Check if GEMINI_API_KEY is set correctly
    • Ensure using @google/generative-ai package

  2. CORS Error: Backend not running or wrong URL

    • Start backend server first
    • Check API_URL in frontend

  3. Connection Failed: Network or firewall issues

    • Check if ports 3000 and 5173 are available
    • Disable firewall temporarily for testing

Debug Commands:

# Check API key
echo $GEMINI_API_KEY

# Test backend directly
node backend/test-api.js

# Check if ports are in use
netstat -an | findstr :3000
netstat -an | findstr :5173

📱 Features Overview

Feature Description Status
🎯 Zero-Shot Direct AI responses ✅ Fixed
💡 One-Shot Learning with examples ✅ Working
🔄 Multi-Shot Multiple examples ✅ Working
🧠 Chain of Thought Step-by-step reasoning ✅ Working
🃏 Flashcards Study card generator ✅ Working
🔗 Connection Status Real-time backend status ✅ New
🎨 Modern UI Glassmorphism design ✅ New

🎯 Next Steps

  1. Test all features to ensure they work correctly
  2. Deploy to production with proper environment variables
  3. Add more features like file upload, voice input, etc.
  4. Optimize performance with caching and rate limiting

Your Smart Study Assistant is now ready to use! 🎉