MediConnect

MediConnect is a full-stack healthcare platform designed for medicine availability and affordability. It combines a premium responsive frontend with a robust backend API for authentication, medicine search, pharmacy management, admin analytics, and more.

Features

Frontend

• Premium, responsive landing page with glassmorphism UI
• User authentication (login & signup)
• Medicine search, filter, and details exploration
• Pharmacy dashboard for inventory and order management
• Admin dashboard with analytics and reporting
• About, contact, FAQ pages
• Toast notifications and smooth animations

Backend

• RESTful API with Express.js
• User authentication and authorization
• Medicine inventory management
• Order processing and tracking
• Pharmacy management
• Admin analytics and reporting
• Role-based access control

Project Structure

POJECT_MED/
├── index.html
├── login.html
├── signup.html
├── medicines.html
├── pharmacy.html
├── admin.html
├── about.html
├── contact.html
├── app.js
├── script.js
├── style.css
├── styles.css
├── medicines.json
├── package.json
├── README.md
├── client/
│   ├── app.js
│   └── index.html
└── server/
    ├── server.js
    ├── seed.js
    ├── package.json
    ├── config/
    │   └── env.js
    ├── controllers/
    │   ├── adminController.js
    │   ├── authController.js
    │   ├── medicineController.js
    │   ├── orderController.js
    │   └── pharmacyController.js
    ├── middlewares/
    │   └── authMiddleware.js
    ├── models/
    │   ├── Medicine.js
    │   ├── Order.js
    │   └── User.js
    ├── routes/
    │   ├── adminRoutes.js
    │   ├── authRoutes.js
    │   ├── medicineRoutes.js
    │   ├── orderRoutes.js
    │   ├── pharmacyRoutes.js
    │   └── userRoutes.js
    └── utils/
        └── store.js

Problem Statement

Many patients struggle to find affordable medicines, compare available options, and locate nearby verified pharmacies in real time.

Solution

MediConnect makes medicine discovery fast, transparent, and accessible by combining search, pharmacy discovery, availability data, and cost comparison in one unified platform.

Technology Stack

Frontend

• HTML5
• CSS3
• Vanilla JavaScript
• JSON

Backend

• Node.js
• Express.js
• JavaScript

Installation & Setup

Prerequisites

• Node.js (v14 or higher)
• npm or yarn

Frontend Setup

1. Navigate to the root directory:

cd POJECT_MED

2. Open in a browser directly, or serve with a local server:

# Using Python 3
python -m http.server 8000

# Or using Node.js http-server
npx http-server

3. Access at http://localhost:8000/

Backend Setup

1. Navigate to the server directory:

cd server

2. Install dependencies:

npm install

3. Configure environment variables in config/env.js as needed

4. Seed the database (if applicable):

npm run seed

5. Start the server:

npm start

The backend API will be available at http://localhost:3000 (or your configured port)

Usage

For Users

1. Visit the landing page at the root URL
2. Create an account via signup or login with existing credentials
3. Browse and search for medicines
4. View pharmacy details and place orders
5. Track your orders

For Admins

1. Login with admin credentials
2. Access the admin dashboard to view analytics
3. Manage medicines, orders, and user inquiries

For Pharmacies

1. Login as a pharmacy user
2. Manage inventory
3. Process orders
4. View analytics

API Endpoints

The backend provides RESTful endpoints for:

• Authentication: Login, signup, logout
• Medicines: Get all medicines, search, filter, get details
• Orders: Create, view, update order status
• Pharmacy: Manage inventory, view orders
• Admin: Analytics, user management, order reports
• Users: Profile management, order history

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

This project is part of a hackathon initiative. All rights reserved.

• Chart.js for admin analytics

Future Scope

• Real pharmacy API integrations
• Personalized medicine recommendations
• AI-based pricing and stock forecasting
• Multi-language support
• Mobile app version

Deployment Steps

1. Upload the project files to any static host such as GitHub Pages, Netlify, or Vercel.
2. Ensure the JSON file is served correctly.
3. Configure a custom domain if needed.

Screenshots

Placeholder for screenshots.

Team Roles

• UI/UX Designer
• Frontend Developer
• Product Strategist
• Healthcare Domain Contributor

License

This project is intended for hackathon demonstration and educational purposes.