AgroBot is a modern, AI-powered farming assistant with a beautiful Gemini-style unified chat interface. Built for project expos and real-world agricultural applications, it provides farmers with instant, multilingual advice on crops, soil, irrigation, pest control, and plant disease detection.
- Single conversation thread like ChatGPT/Gemini
- Voice, text, and image inputs work seamlessly in one chat
- Chat persistence - Messages saved across page refreshes
- Audio playback with pause/resume/stop controls
- Professional landing page with smooth navigation
- Speak in English, Hindi (हिंदी), or Telugu (తెలుగు)
- Voice transcription displayed in chat
- Automatic audio response for voice inputs
- Multi-language speech synthesis
- Type farming queries for instant AI answers
- Powered by Google Gemini 2.5 Flash
- Responses translated to selected language
- Optional audio playback (manual control)
- Upload plant/crop photos for disease detection
- Gemini Vision AI powered analysis
- Treatment recommendations included
- Visual feedback with image preview
- Landing page with hero section and features
- Gemini-style bottom toolbar with all tools
- Language selector integrated in chat
- Back button to return to home
- Responsive design for all devices
- Smooth animations with Framer Motion
┌─────────────────────────────────────────┐
│ React Frontend (Port 3000) │
│ ┌───────────────────────────────────┐ │
│ │ Landing Page │ │
│ │ • Hero Section │ │
│ │ • Features Showcase │ │
│ │ • CTA Buttons │ │
│ └───────────────────────────────────┘ │
│ ┌───────────────────────────────────┐ │
│ │ Chat Interface (Gemini-style) │ │
│ │ • Unified conversation view │ │
│ │ • Voice/Text/Image tools │ │
│ │ • Audio controls (pause/resume) │ │
│ │ • Chat persistence (localStorage)│ │
│ │ • Language selector in toolbar │ │
│ └───────────────────────────────────┘ │
└──────────────┬──────────────────────────┘
│
│ REST API (HTTP/JSON)
│
┌──────────────▼──────────────────────────┐
│ Flask Backend (Port 5000) │
├─────────────────────────────────────────┤
│ /api/chat → Google Gemini AI │
│ /api/transcribe → Groq Whisper STT │
│ /api/tts → gTTS + Translation │
│ /api/analyze-image → Gemini Vision │
└─────────────────────────────────────────┘
- Node.js 18+ and npm
- Python 3.9+
- Google Gemini API Key - Get it here
- Groq API Key - Get it here
# Copy environment template
copy .env.example .envEdit .env and add your API keys:
GOOGLE_API_KEY=your_google_api_key_here
GROQ_API_KEY=your_groq_api_key_hereOption A - All at once (Recommended):
npm run setupOption B - Separately:
# Install Python dependencies
pip install -r requirements.txt
# Install Node dependencies
npm run setup:frontendOption A - Both servers together (Recommended):
npm start
# or
npm run devOption B - Run separately:
Terminal 1 - Backend:
npm run backendBackend will run on http://localhost:5000
Terminal 2 - Frontend:
npm run frontendFrontend will run on http://localhost:3000
Navigate to http://localhost:3000 and start using AgroBot! 🎉
| Command | Description |
|---|---|
npm run setup |
Install all dependencies (frontend + backend) |
npm start or npm run dev |
Start both backend and frontend servers |
npm run backend |
Start only Flask backend (port 5000) |
npm run frontend |
Start only React frontend (port 3000) |
npm run build |
Build frontend for production |
npm run check |
Validate setup configuration |
practice/
│
├── 📁 backend/ # Python/Flask Backend
│ ├── backend_api.py # Flask REST API server (MAIN)
│ ├── agrobot_chat.py # Gemini chat logic
│ ├── universal_stt.py # Groq Whisper STT
│ ├── tts_engine.py # gTTS + translation
│ └── image.py # Image analysis module
│
├── 📁 frontend/ # React Application
│ ├── src/
│ │ ├── App.jsx # Main app component
│ │ ├── main.jsx # Entry point
│ │ ├── index.css # Tailwind styles
│ │ └── components/
│ │ ├── Header.jsx # App header with language selector
│ │ ├── TabNavigation.jsx # Tab switcher
│ │ ├── VoiceMode.jsx # Voice recording & STT
│ │ ├── TextMode.jsx # Text chat interface
│ │ ├── ImageAnalysis.jsx # Image upload & analysis
│ │ └── Footer.jsx # Footer with info
│ ├── index.html
│ ├── package.json
│ ├── vite.config.js
│ └── tailwind.config.js
│
├── 📁 docs/ # Documentation
│ ├── QUICKSTART.md # Quick setup guide for expo
│ ├── PRESENTATION_GUIDE.md # Full presentation guide
│ ├── COMMANDS.md # Command reference
│ └── PROJECT_SUMMARY.md # Project overview
│
├── 📁 scripts/ # Setup & Automation
│ ├── setup.bat # One-click setup
│ ├── start.bat # One-click start
│ └── check_setup.py # Pre-flight validation
│
├── 📄 Configuration
│ ├── requirements.txt # Python dependencies
│ ├── .env # API keys (create from .env.example)
│ ├── .env.example # Environment template
│ └── .gitignore # Git ignore rules
│
└── README.md # This file
AgroBot uses a modern agricultural theme with:
- Primary Colors: Green shades (🌿 #22c55e) representing growth and nature
- Secondary Colors: Earth tones (🌾 #bfa094) for warmth
- Typography: Inter font family for clarity
- Animations: Smooth transitions with Framer Motion
- Responsive: Mobile-first design approach
| Endpoint | Method | Description |
|---|---|---|
/api/health |
GET | Health check |
/api/chat |
POST | Get farming advice |
/api/transcribe |
POST | Convert speech to text |
/api/tts |
POST | Convert text to speech |
/api/analyze-image |
POST | Analyze plant disease |
- React 18 - UI framework
- Vite - Build tool
- Tailwind CSS - Styling
- Framer Motion - Animations
- Axios - HTTP client
- React Icons - Icon library
- Flask - Web framework
- Google Gemini - AI chat & vision
- Groq Whisper - Speech-to-text
- gTTS - Text-to-speech
- Deep Translator - Multi-language support
- Pillow - Image processing
- 🇬🇧 English (en)
- 🇮🇳 Hindi (hi - हिंदी)
- 🇮🇳 Telugu (te - తెలుగు)
- Real-time audio recording with visual feedback
- Automatic transcription and AI response
- Voice playback in selected language
- Clean, chat-like interface
- Example questions for quick start
- Instant AI responses with audio
- Drag-and-drop image upload
- Disease detection and identification
- Organic treatment recommendations
- Crop Management - Get advice on planting, watering, and harvesting
- Disease Detection - Identify plant diseases from photos
- Pest Control - Learn organic and chemical pest management
- Soil Health - Understand soil improvement techniques
- Irrigation Planning - Optimize water usage
- API keys stored in
.env(not in version control) - CORS enabled for frontend communication
- Input validation on all endpoints
- File size limits for uploads
Frontend:
cd frontend
npm run build
# Files in frontend/dist/Backend:
gunicorn -w 4 -b 0.0.0.0:5000 backend_api:app- Frontend: Vercel, Netlify, or GitHub Pages
- Backend: Heroku, Railway, or AWS EC2
- Full Stack: DigitalOcean, Render, or Docker
Contributions are welcome! Feel free to:
- Report bugs
- Suggest features
- Submit pull requests
This project is licensed under the MIT License.