AgroTrack transforms agricultural monitoring through cutting-edge technology. Built with Next.js 15, powered by Google's Gemini AI, and backed by a robust Prisma + SQLite stack, it delivers real-time insights, predictive analytics, and stunning 3D visualizations for modern farming.
╔══════════════════════════════════════════════════════════════╗
║ 🤖 AI-Powered Analytics 📊 Real-time Dashboards ║
║ 🔐 Secure Authentication 🎨 Modern UI/UX ║
║ 🌐 3D Visualizations 📱 Responsive Design ║
║ ⚡ Lightning Fast 🔄 Live Updates ║
╚══════════════════════════════════════════════════════════════╝
|
|
|
|
graph LR
A[Next.js 15] --> B[React 19]
A --> C[TypeScript]
A --> D[Tailwind CSS]
E[Backend] --> F[Prisma ORM]
E --> G[SQLite]
E --> H[NextAuth.js]
I[AI Layer] --> J[Google Gemini]
I --> K[Genkit]
L[Integrations] --> M[Firebase]
L --> N[Three.js]
L --> O[Recharts]
style A fill:#000,stroke:#fff,color:#fff
style E fill:#2D3748,stroke:#fff,color:#fff
style I fill:#4285F4,stroke:#fff,color:#fff
style L fill:#FFCA28,stroke:#000,color:#000
const frontend = {
framework: "Next.js 15 (App Router)",
language: "TypeScript",
styling: ["Tailwind CSS", "shadcn/ui", "Radix UI"],
state: ["React 19", "React Hook Form"],
animation: ["Framer Motion", "tailwindcss-animate"],
icons: "Lucide React"
}const backend = {
orm: "Prisma Client",
database: "SQLite (better-sqlite3)",
auth: "NextAuth.js",
api: "Next.js API Routes",
validation: ["Zod", "@hookform/resolvers"]
}const advanced = {
ai: ["Google Gemini", "Genkit", "@genkit-ai/google-genai"],
visualization: ["Recharts", "Three.js", "@react-three/fiber", "@react-three/drei"],
utilities: ["date-fns", "clsx", "class-variance-authority"]
}node >= 18.0.0
npm >= 9.0.0# 1️⃣ Clone the repository
git clone https://github.com/yourusername/agrotrack.git
cd agrotrack
# 2️⃣ Install dependencies
npm install
# 3️⃣ Set up environment variables
cp .env.example .env
# Edit .env with your credentials
# 4️⃣ Generate Prisma Client
npx prisma generate
# 5️⃣ Run migrations
npx prisma migrate dev
# 6️⃣ Start development server
npm run dev🎉 Open http://localhost:9002 and start farming smarter!
Create a .env file in the root directory:
# 🤖 AI Configuration
GEMINI_API_KEY="your_gemini_api_key_here"
# 💾 Database
DATABASE_URL="file:./prisma/dev.db"
# 🔐 Authentication
NEXTAUTH_URL="http://localhost:9002"
NEXTAUTH_SECRET="generate_a_secure_random_string"
# 🌐 Google OAuth
GOOGLE_CLIENT_ID="your_google_client_id"
GOOGLE_CLIENT_SECRET="your_google_client_secret"🔍 How to get Google OAuth credentials
- Go to Google Cloud Console
- Create a new project or select existing
- Navigate to APIs & Services > Credentials
- Create OAuth 2.0 Client ID
- Add authorized origins:
http://localhost:9002 - Add redirect URI:
http://localhost:9002/api/auth/callback/google - Copy Client ID and Secret to
.env
| Command | Description |
|---|---|
npm run dev |
🔥 Start development server with Turbopack on port 9002 |
npm run build |
📦 Build for production |
npm start |
🚀 Start production server |
npm run lint |
🔍 Run ESLint |
npm run typecheck |
✅ Check TypeScript types |
npm run genkit:dev |
🤖 Start Genkit AI development server |
npm run genkit:watch |
👀 Start Genkit in watch mode |
AgroTrack/
├── 📁 src/
│ ├── 🎨 app/ # Next.js App Router pages & API routes
│ │ ├── api/ # Backend API endpoints
│ │ ├── auth/ # Authentication pages
│ │ └── dashboard/ # Main dashboard
│ │
│ ├── 🧩 components/ # Reusable React components
│ │ ├── ui/ # shadcn/ui components
│ │ └── charts/ # Visualization components
│ │
│ ├── 🤖 ai/ # Genkit & Gemini integration
│ ├── 🔥 firebase/ # Firebase configuration
│ ├── 🎣 hooks/ # Custom React hooks
│ ├── 📚 lib/ # Utility functions & configs
│ ├── 🌍 locales/ # i18n translations
│ └── 🎭 context/ # React context providers
│
├── 🗄️ prisma/
│ ├── schema.prisma # Database schema
│ ├── migrations/ # Database migrations
│ └── dev.db # SQLite database file
│
├── ⚙️ Configuration Files
│ ├── next.config.ts # Next.js configuration
│ ├── tailwind.config.ts # Tailwind CSS settings
│ ├── tsconfig.json # TypeScript configuration
│ └── prisma.config.ts # Prisma configuration
│
└── 📄 Documentation
├── README.md # You are here!
└── .env.example # Environment template
sequenceDiagram
participant U as User
participant A as Auth Page
participant N as NextAuth
participant G as Google OAuth
participant D as Database
U->>A: Visit /auth
A->>U: Show login options
alt Google Sign-In
U->>N: Click "Sign in with Google"
N->>G: Redirect to Google
G->>N: Return with token
N->>D: Create/Update user
else Email/Password
U->>N: Submit credentials
N->>D: Verify password hash
end
N->>U: Redirect to /dashboard
U->>A: Access protected routes
Security Features:
- 🔒 Bcrypt password hashing
- 🎫 JWT-based sessions
- 🌐 OAuth 2.0 with Google
- 🛡️ CSRF protection
- ⏱️ Session expiration
model User {
id String @id @default(cuid())
name String?
email String @unique
passwordHash String
createdAt DateTime @default(now())
updatedAt DateTime @updatedAt
}Prisma Commands:
npx prisma studio # Open Prisma Studio GUI
npx prisma migrate dev # Create and apply migration
npx prisma generate # Regenerate Prisma Client
npx prisma db push # Push schema without migrationAgroTrack leverages Google's Gemini AI through Genkit for intelligent features:
- 🌱 Crop Recommendations based on soil & climate
- 📈 Yield Predictions using historical data
- 🌤️ Weather Impact Analysis
- 🐛 Pest & Disease Detection
- 💬 Natural Language Queries
import { genkit } from '@genkit-ai/core';
import { gemini15Flash } from '@genkit-ai/google-genai';
const ai = genkit({
plugins: [googleAI()],
model: gemini15Flash
});
const response = await ai.generate({
prompt: 'Analyze crop health from image',
config: { temperature: 0.7 }
});Built with shadcn/ui and Radix UI for accessibility and customization:
import { Button } from '@/components/ui/button';
import { Card } from '@/components/ui/card';
import { LineChart } from 'recharts';
<Card className="p-6">
<LineChart data={cropData}>
<Line dataKey="yield" stroke="#10b981" />
</LineChart>
<Button variant="default">Analyze Trends</Button>
</Card>Component Library:
- Buttons, Cards, Dialogs, Dropdowns
- Forms, Inputs, Select boxes
- Toast notifications, Tooltips
- Tabs, Accordions, Progress bars
🔴 Prisma Client Error
Error: Cannot find module '.prisma/client/default'Solution:
npm install
npx prisma generate
npm run dev🔴 NextAuth Configuration Error
[NEXTAUTH_URL] Missing NEXTAUTH_URLSolution:
Add to .env:
NEXTAUTH_URL="http://localhost:9002"
NEXTAUTH_SECRET="your-secret-here"🔴 Google OAuth Error
Error: client_id is requiredSolution:
- Verify
.envhas validGOOGLE_CLIENT_IDandGOOGLE_CLIENT_SECRET - Check Google Cloud Console redirect URIs match
http://localhost:9002/api/auth/callback/google - Restart dev server
# Build the application
npm run build
# Start production server
npm start| Platform | Documentation |
|---|---|
| Vercel | Deploy to Vercel |
| Firebase Hosting | Firebase Deploy |
| AWS Amplify | AWS Amplify Docs |
| Docker | docker build -t agrotrack . |
- 🌍 Multi-language support (i18n)
- 📱 Native mobile apps (React Native)
- 🎥 Live video streaming from farm cameras
- 🤝 Multi-tenant organization support
- 📊 Advanced ML models for precision farming
- 🔌 IoT sensor integration
- 📧 Email notification system
- 📱 SMS alerts via Twilio
We welcome contributions! Here's how you can help:
- 🍴 Fork the repository
- 🌿 Create a feature branch (
git checkout -b feature/AmazingFeature) - ✅ Commit your changes (
git commit -m 'Add AmazingFeature') - 📤 Push to the branch (
git push origin feature/AmazingFeature) - 🔀 Open a Pull Request
- Write meaningful commit messages
- Follow TypeScript best practices
- Add tests for new features
- Update documentation as needed
MIT License
Copyright (c) 2025 AgroTrack
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software...
Need help? We're here for you!
- Next.js - The React Framework
- Prisma - Next-generation ORM
- Google Gemini - AI Foundation
- shadcn/ui - Beautiful Components
- Vercel - Deployment Platform
