An open API service indexing awesome lists of open source software.

https://github.com/ik-riyad/mango_client

A beautifully themed, full-stack, mobile-responsive web application designed to help plant lovers easily monitor and manage the care of their indoor and outdoor plants. Built with love for green thumbs, this app tracks everything from watering to plant health — all in one place.
https://github.com/ik-riyad/mango_client

daisiyui dotenv express firebase-auth mongodb node react router tailwindcss

Last synced: 2 months ago
JSON representation

A beautifully themed, full-stack, mobile-responsive web application designed to help plant lovers easily monitor and manage the care of their indoor and outdoor plants. Built with love for green thumbs, this app tracks everything from watering to plant health — all in one place.

Awesome Lists containing this project

README

          

# 🌿 Plant Care Tracker

## 🔎 Project Overview

> A beautifully themed, full-stack, mobile-responsive web application designed to help plant lovers easily monitor and manage the care of their indoor and outdoor plants. Built with love for green thumbs, this app tracks everything from watering to plant health — all in one place.

---

## 📸 Screenshot

![Project Screenshot](public/Screenshot_2.png)

---

## 🛠 Technologies Used

- React.js (Frontend UI)
- Node.js & Express (Backend API)
- MongoDB (Database) – if applicable
- Axios (HTTP client)
- date-fns (Real-time date and time display)
- Firebase Authentication / JWT (User authentication)
- Tailwind CSS (Styling)
- Context API (State management)

---

## ✨ Core Features

- Real-time date and time display in the navigation bar.
- Fully responsive, clean navigation with light/dark theme toggling.
- Attractive sliding banner showcasing plant care visuals and tips.
- Plant cards with detailed view options for plant care instructions.
- Secure user authentication (register, login, logout).
- Personal user dashboard with:
- User's own plant list
- Personal information section
- Editable and deletable plant records
- Detailed plant page showing care logs and health status.
- Theming that changes based on plant categories (e.g., succulents, bonsai).
- Clean footer with modal for contact/help and useful links.

---

## ⚙️ Dependencies

- react, react-dom
- axios
- firebase / jsonwebtoken
- date-fns
- react-router-dom
- express
- mongoose
- dotenv
- tailwindcss

---

## 🚀 How to Run Locally

1. **Clone the repository:**

```bash
git clone https://github.com/Ik-Riyad/mango_client.git
cd plant-care-tracker

2. **Install frontend dependencies:**
```

- cd client
- npm install

3. **Install backend dependencies:**

- cd ../server
- npm install

4. **Setup environment variables:**

- Create .env files in both client and server directories.

- Add your MongoDB URI, Stripe keys, Firebase config, and other sensitive data.

5. **Start backend server:**

- npm run dev

6. **Start frontend app:**

- cd ../client
- npm start

7. **Open in browser:**

- Visit http://localhost:3000

## 🔗 Live Project

- 🌐[Live Project](https://unique-donut-b731f9.netlify.app/)

## 📬 Contact

- Reach me at: ik.riyad123@gmail.com