🩸 Blood Bank Management System

A web application that allows users to request blood donations or donate blood based on available requests. The platform includes an easy registration system, a role-based dynamic dashboard, and donor search functionality.

🔗 Live Site: Blood Bank Management System

🛠 Admin Credentials:

• Email: admin@gmail.com
• Password: 123456

---

📸 Screenshot

---

🚀 Features

✅ User Registration & Authentication (Firebase)
✅ Create & View Blood Donation Requests
✅ Role-Based Dashboard (Admin, User, Volunteer)
✅ Admin & Volunteer Statistics & Blog Management
✅ Search for Donors Easily
✅ User Profile Management
✅ Dynamic API Using Express.js
✅ MongoDB Server for Data Storage
✅ Secure Payments Integration (Stripe)

---

🛠 Technologies Used

• Frontend: React.js, Vite, Firebase Authentication
• Backend: Node.js, Express.js
• Database: MongoDB
• State Management & Queries: React Query
• Payment Gateway: Stripe
• UI Components: Tailwind CSS, Material Tailwind, Heroicons
• Editor: Jodit

---

📦 Dependencies

This project relies on the following major dependencies:

Frontend Dependencies:

• react - Frontend library
• react-dom - DOM bindings for React
• react-router-dom - Routing library
• react-hook-form - Form handling
• axios - HTTP client for API requests
• firebase - User authentication
• sweetalert2 - Popup alerts
• react-hot-toast - Toast notifications
• react-icons - Icon library
• react-spinners - Loading spinners
• @heroicons/react - Heroicons for UI
• @material-tailwind/react - UI components
• @tanstack/react-query - Data fetching and caching
• @stripe/react-stripe-js - Stripe payments integration
• @stripe/stripe-js - Stripe JavaScript SDK
• html-to-text - Convert HTML to plain text
• jodit & jodit-react - Rich text editor

Development Dependencies:

• vite - Fast build tool
• eslint & eslint plugins - Code linting
• tailwindcss - CSS framework
• postcss & autoprefixer - CSS processing

---

🛠 Installation & Setup

Follow these steps to run the project locally:

1️⃣ Clone the Repository

git clone https://github.com/your-repo/blood-bank.git
cd blood-bank

2️⃣ Install Dependencies

npm install

3️⃣ Setup Environment Variables Create a .env file and add the required Firebase and MongoDB credentials:

MONGO_URI=your_mongodb_connection_string
FIREBASE_API_KEY=your_firebase_api_key

4️⃣ Start the Backend Server

npm start

5️⃣ Run the Frontend Navigate to the frontend directory and start the React app:

cd frontend
npm install
npm start

🌍 Live Project Links

Live Website: Blood Bank Live

Backend API: Blood Bank API