GardenTrack 🌱
A comprehensive full-stack garden plant and maintenance tracking system built with React.js, TypeScript, Express.js, and SQLite.
Features
🌿 Plant Registry Module
- Add and manage all plants in your garden (trees, shrubs, herbs, etc.)
- Track plant type, variety/species, planting date, and health status
- Store detailed notes for each plant
- Visual health status indicators
📊 Yearly History Tracking
- Year-by-year history of blooming and fruiting dates
- Comprehensive harvest records with quantity and date tracking
- Maintenance activity logs with detailed descriptions
🔧 Maintenance Task Logging
- Log chemical treatments, fertilizer applications, and other garden activities
- Track dates, types, descriptions, and amounts used
- Categorized maintenance types for easy filtering
📅 Task Planning and Reminders
- Create future tasks with titles, descriptions, and deadlines
- Visual dashboard showing upcoming and overdue tasks
- Mark tasks as completed with progress tracking
🎨 Additional Features
- Responsive Design: Optimized for desktop, tablet, and mobile devices
- Search & Filter: Find plants and records quickly
- Modern UI: Clean, nature-inspired interface with smooth animations
- Dashboard Overview: At-a-glance view of garden status and upcoming tasks
Technology Stack
Frontend
- React.js 18 with TypeScript
- Tailwind CSS for styling
- Lucide React for icons
- Vite for development and building
Backend
- Express.js REST API
- SQLite database
- CORS enabled for cross-origin requests
Deployment
- Docker Compose setup with multi-container architecture
- Nginx reverse proxy for production
- Containerized frontend and backend services
Getting Started
Prerequisites
- Node.js 18+ and npm
- Docker and Docker Compose (for containerized deployment)
Development Setup
-
Clone and install dependencies:
# Install frontend dependencies npm install # Install backend dependencies cd backend npm install
-
Initialize the database:
cd backend npm run init-db
-
Start development servers:
# Start backend (in backend directory) npm run dev # Start frontend (in root directory) npm run dev
-
Access the application:
- Frontend: http://localhost:5173
- Backend API: http://localhost:3001
Docker Deployment
-
Build and start services:
docker-compose up --build
-
Initialize database:
docker-compose run db-init
-
Access the application:
- Application: http://localhost:3000
- API: http://localhost:3001
API Endpoints
Plants
GET /api/plants
- Get all plantsPOST /api/plants
- Create new plantPUT /api/plants/:id
- Update plantDELETE /api/plants/:id
- Delete plant
Tasks
GET /api/tasks
- Get all tasksPOST /api/tasks
- Create new taskPUT /api/tasks/:id
- Update taskDELETE /api/tasks/:id
- Delete task
Maintenance Records
GET /api/maintenance
- Get all maintenance recordsPOST /api/maintenance
- Create maintenance record
Harvest Records
GET /api/harvests
- Get all harvest recordsPOST /api/harvests
- Create harvest record
Database Schema
The application uses SQLite with the following main tables:
- plants - Store plant information
- tasks - Task planning and tracking
- maintenance_records - Maintenance activity logs
- harvest_records - Harvest tracking
- plant_history - Year-by-year plant history
Project Structure
gardentrack/
├── src/ # Frontend source code
│ ├── components/ # React components
│ ├── services/ # API services
│ ├── types/ # TypeScript types
│ └── App.tsx # Main application component
├── backend/ # Backend source code
│ ├── scripts/ # Database initialization
│ ├── database/ # SQLite database files
│ └── server.js # Express server
├── docker-compose.yml # Docker services configuration
└── README.md # Project documentation
Contributing
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature
) - Commit your changes (
git commit -m 'Add amazing feature'
) - Push to the branch (
git push origin feature/amazing-feature
) - Open a Pull Request
License
This project is licensed under the MIT License - see the LICENSE file for details.
Support
For support, please open an issue in the GitHub repository or contact the development team.
Happy Gardening! 🌱
Description
Languages
TypeScript
80%
JavaScript
19.8%
HTML
0.1%