https://github.com/redoy49/fresh-farmers
A subscription box service platform for personalized monthly grocery delivery, including fresh vegetables and fruits.
https://github.com/redoy49/fresh-farmers
ecomerce-website firebase mongodb react subscription-box tailwindcss
Last synced: 3 months ago
JSON representation
A subscription box service platform for personalized monthly grocery delivery, including fresh vegetables and fruits.
- Host: GitHub
- URL: https://github.com/redoy49/fresh-farmers
- Owner: redoy49
- Created: 2025-06-25T06:27:10.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-06-25T10:50:40.000Z (about 1 year ago)
- Last Synced: 2025-08-23T14:59:24.539Z (11 months ago)
- Topics: ecomerce-website, firebase, mongodb, react, subscription-box, tailwindcss
- Language: JavaScript
- Homepage: https://subscription-box-df504.web.app
- Size: 2.36 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🥬 FreshFarmers – Subscription Box Service Platform
FreshFarmers is a full-featured subscription box platform that allows users to browse and subscribe to curated monthly grocery boxes, including fresh vegetables, fruits, and other essentials. The platform is designed to save time and provide high-quality products delivered directly to your doorstep.
---
## 🌐 Live Website
🔗 [Visit Live Site](https://subscription-box-df504.web.app)
---
## 🎯 Project Purpose
The goal of FreshFarmers is to simplify grocery shopping for busy individuals through:
- Personalized monthly subscription boxes
- Convenient delivery on the 1st of each month
- Easy management of subscription preferences
- Seamless and secure user experience
---
## 🚀 Technologies Used
### 🧩 Frontend:
- React
- React Router DOM
- Tailwind CSS
- DaisyUI
- Swiper.js (for homepage slider)
- React Toastify
- React Icons
- React Helmet for dynamic titles
### 🔐 Authentication:
- Firebase Authentication (Email/Password + Google)
- Firebase's updateProfile() for user info editing
### 🎁 Data:
- Static JSON-based service listings
- Hosted images via ImgBB/PostImages
### 🚀 Deployment:
- Client: Firebase Hosting
---
## ✨ Key Features
- 🌐 Fully responsive layout for mobile, tablet, and desktop
- 🧭 Dynamic navigation bar showing user profile image and logout option when logged in
- 👤 Protected routes with persistent authentication (Profile, Subscription Details, Blog)
- 🔐 User info update capability using Firebase updateProfile()
- 🧾 Subscription box browsing with detailed view and review/rating submission
- 🎨 Interactive banner slider implemented with Swiper.js
- 📌 Dynamic page titles for SEO and UX via React Helmet
- 🔁 Show/hide password toggle on registration and login forms
- 🌙 Light/Dark theme toggle using DaisyUI
- 🎉 Success and error notifications via SweetAlert2 and React Toastify
- 🧪 Functional "Forgot Password" page with email pre-fill and redirect
- 🛠 Custom 404 page with user-friendly messaging
---
## 📦 Dependencies
- `react`
- `react-router-dom`
- `tailwindcss` + `daisyui`
- `swiper`
- `firebase`
- `react-toastify`
- `react-icons`
- `react-helmet`
- `sweetalert2`
- `aos` *(for animation)*
---
## 🛠️ How to Run Locally
### Step 1: Clone the Repository
```bash
git clone https://github.com/redoy49/freshfarmers-client.git
cd freshfarmers-client
```
### Step 2: Install Dependencies
```bash
npm install
```
### Step 3: Create a .env File
```env
VITE_FIREBASE_API_KEY=your_api_key
VITE_FIREBASE_AUTH_DOMAIN=your_auth_domain
VITE_FIREBASE_PROJECT_ID=your_project_id
VITE_FIREBASE_STORAGE_BUCKET=your_storage_bucket
VITE_FIREBASE_MESSAGING_SENDER_ID=your_sender_id
VITE_FIREBASE_APP_ID=your_app_id
```
### Step 4: Run the App
```bash
npm run dev
```
---
## 🔗 Relevant Links
🔴 **Live Website**: https://subscription-box-df504.web.app
🟠 **GitHub Repo**: https://github.com/redoy49/freshfarmers-client
---
## 📌 Notes
✅ Firebase & API credentials are stored securely in `.env`
✅ SweetAlert2 and React Toastify are used for all user notifications
✅ Password validation includes uppercase, lowercase, and minimum length rules
✅ Authentication state persists on page reloads for private routes
✅ Review and rating system implemented on subscription details page
✅ Profile page allows users to securely update their display name and photoURL
✅ Includes custom 404 page and loading spinners
✅ Dynamic page titles improve UX and SEO
---
## 👤 Author
📧 **Email**: mdredoyhasan49@gmail.com
🐦 **Twitter**: [@mdredoyhasan49](https://twitter.com/mdredoyhasan49)