🏥 MediConnect

A modern full-stack doctor-patient communication platform built with React, TypeScript, and Flask.

---

📋 Table of Contents

• Overview
• Features
• Tech Stack
• Project Structure
• Getting Started
• Environment Variables
• Demo Credentials
• API Reference
• Screenshots
• Contributing
• License

---

🌟 Overview

MediConnect bridges the communication gap between doctors and patients through a unified digital platform. It enables seamless appointment scheduling, digital prescription management, real-time emergency chat, health vitals tracking, and AI-powered medical assistance — all in one place.

🔗 Live Demo: https://lovable.dev/projects/44271c15-65b7-4b2e-88b8-74a9d48f3f84

---

✨ Features

👨‍⚕️ For Doctors

• Dashboard — View today's, upcoming, and past appointments at a glance
• Patient Management — Access patient profiles, vitals, medical history, and notes
• Voice Transcription — Record consultations with real-time voice-to-text transcription
• Prescription Management — Create, manage, and print digital prescriptions
• Emergency Chat — Respond to urgent patient messages with quick-reply templates

🧑‍💼 For Patients

• Appointment Booking — Browse available time slots and schedule appointments
• Health Vitals — Track blood pressure, heart rate, temperature, and oxygen levels
• Prescriptions — View active and past prescriptions with full medication details
• Emergency Help — Direct line to your doctor for urgent queries

🤖 AI-Powered Features

• AI Chat Assistant — Medical Q&A powered by GPT-4
• First Aid Assistant — Step-by-step emergency guidance with video suggestions
• Symptom Analyzer — AI-driven symptom-to-condition analysis with severity rating
• Medication Information — Detailed drug info including side effects and interactions
• Voice Commands — Navigate the app hands-free using speech recognition

🌍 Additional Highlights

• Multilingual Support — English, Spanish, French, German, Chinese (i18n via i18next)
• Real-time Notifications — Socket.IO-powered push alerts for appointments and messages
• PDF Export — Download appointment summaries and invoices as PDFs
• PWA Support — Installable progressive web app with service worker caching
• Responsive Design — Fully optimized for mobile, tablet, and desktop

---

🛠 Tech Stack

Frontend

Technology	Purpose
React 18 + TypeScript	UI framework
Vite	Build tool
Tailwind CSS	Styling
shadcn/ui + Radix UI	Component library
React Router v6	Client-side routing
TanStack Query	Server state management
Socket.IO Client	Real-time communication
i18next	Internationalization
jsPDF + jspdf-autotable	PDF generation
date-fns	Date utilities

Backend

Technology	Purpose
Flask	Web framework
Flask-SQLAlchemy	ORM / Database
Flask-SocketIO	Real-time WebSocket events
Flask-JWT-Extended	Authentication
Flask-CORS	Cross-origin support
OpenAI API (GPT-4)	AI features
SQLite	Database (dev)

---

📁 Project Structure

medconnect/
├── backend/
│   ├── app.py                  # Flask app factory
│   ├── config.py               # Environment configuration
│   ├── extensions.py           # SQLAlchemy & SocketIO instances
│   ├── models.py               # Database models
│   ├── requirements.txt        # Python dependencies
│   ├── routes/
│   │   ├── auth.py             # Register, login, profile
│   │   ├── appointments.py     # CRUD for appointments
│   │   ├── prescriptions.py    # CRUD for prescriptions
│   │   ├── chat.py             # Messaging + AI fallback
│   │   ├── notifications.py    # Real-time notifications
│   │   └── voice.py            # Voice command processing
│   └── utils/
│       └── auth.py             # JWT middleware decorators
│
├── src/
│   ├── components/
│   │   ├── appointments/       # AppointmentList, Form, Details
│   │   ├── chat/               # AIChatAssistant
│   │   ├── first-aid/          # FirstAidAssistant
│   │   ├── health/             # SymptomAnalyzer, MedicationInfo, HealthTips
│   │   ├── layout/             # Header, Sidebar, Layout
│   │   ├── prescriptions/      # PrescriptionBilling
│   │   ├── voice/              # VoiceAssistant
│   │   └── ui/                 # shadcn/ui primitives
│   ├── contexts/
│   │   └── AuthContext.tsx     # Auth state management
│   ├── data/                   # Mock data (appointments, patients, etc.)
│   ├── hooks/                  # Custom hooks (use-toast, use-mobile)
│   ├── i18n/                   # Translations (en, es)
│   ├── pages/
│   │   ├── doctor/             # DoctorDashboard, Transcription, Prescriptions, Patients
│   │   ├── patient/            # PatientDashboard, Booking, Vitals, Prescriptions
│   │   ├── EmergencyChat.tsx
│   │   ├── LoginPage.tsx
│   │   └── Index.tsx
│   ├── services/               # aiService, prescriptionService, voiceAssistantService
│   └── types/                  # TypeScript type definitions
│
├── public/
│   ├── manifest.json           # PWA manifest
│   └── service-worker.js       # Offline caching
└── package.json

---

🚀 Getting Started

Prerequisites

• Node.js >= 18
• Python >= 3.10
• npm or yarn

1. Clone the Repository

git clone https://github.com/your-username/medconnect.git
cd medconnect

2. Frontend Setup

npm install
npm run dev

The frontend will start at http://localhost:5173.

3. Backend Setup

cd backend
python -m venv venv
source venv/bin/activate        # Windows: venv\Scripts\activate
pip install -r requirements.txt
python app.py

The backend API will start at http://localhost:5000.

---

🔐 Environment Variables

Create a .env file in the backend/ directory:

OPENAI_API_KEY=your_openai_api_key
JWT_SECRET_KEY=your_jwt_secret
FLASK_SECRET_KEY=your_flask_secret
SOCKETIO_MESSAGE_QUEUE=redis://localhost:6379/
CORS_ORIGINS=http://localhost:5173
API_BASE_URL=http://localhost:5000/api
JWT_ACCESS_TOKEN_EXPIRES=3600
JWT_REFRESH_TOKEN_EXPIRES=604800

Create a .env file in the root (frontend) directory:

VITE_API_BASE_URL=http://localhost:5000/api
VITE_OPENAI_API_KEY=your_openai_api_key

---

🧪 Demo Credentials

The frontend uses mock authentication for demo purposes. No backend required to explore the UI.

Role	Email	Password	License ID
Doctor	doctor@example.com	password	DOC12345
Patient	patient@example.com	password	—

---

📡 API Reference

Auth

Method	Endpoint	Description
POST	/auth/register	Register a new user
POST	/auth/login	Login and receive JWT
GET	/auth/profile	Get current user profile
PUT	/auth/profile	Update user profile

Appointments

Method	Endpoint	Description
GET	/appointments	List appointments (role-filtered)
POST	/appointments	Create appointment
GET	/appointments/:id	Get appointment details
PUT	/appointments/:id	Update appointment
DELETE	/appointments/:id	Delete appointment

Prescriptions

Method	Endpoint	Description
GET	/prescriptions	List prescriptions
POST	/prescriptions	Create prescription (doctor only)
GET	/prescriptions/:id	Get prescription
GET	/prescriptions/:id/invoice	Download invoice

Chat & AI

Method	Endpoint	Description
GET	/chat/messages	Get messages between two users
POST	/first-aid	Get first aid guidance
POST	/voice/process-command	Process voice command

Notifications

Method	Endpoint	Description
GET	/notifications	List notifications
PUT	/notifications/:id/read	Mark as read
PUT	/notifications/read-all	Mark all as read
GET	/notifications/unread-count	Get unread count

---

🤝 Contributing

Contributions are welcome! Here's how to get started:

1. Fork the repository
2. Create a feature branch: git checkout -b feature/your-feature-name
3. Commit your changes: git commit -m 'feat: add your feature'
4. Push to the branch: git push origin feature/your-feature-name
5. Open a Pull Request

Please follow Conventional Commits for commit messages.

---

📄 License

This project is licensed under the MIT License. See the LICENSE file for details.

---

Built with ❤️ using React, TypeScript, and Flask

Live Demo • Report Bug • Request Feature