MediNotes Pro

An AI-powered healthcare consultation SaaS platform that transforms doctor visit notes into professional summaries, actionable next steps, and patient-friendly email drafts using OpenAI's advanced language models.

🚀 Overview

MediNotes Pro is a comprehensive SaaS solution designed for healthcare professionals to streamline their documentation workflow. By leveraging cutting-edge AI technology, the platform automatically generates:

• Professional Visit Summaries for medical records
• Actionable Next Steps for patient care planning
• Patient-Friendly Email Drafts for clear communication

The application features secure authentication, real-time AI streaming, and a modern, responsive interface built with the latest web technologies.

🏗️ Architecture

Frontend

• Framework: Next.js 16 (App Router)
• Language: TypeScript
• Styling: Tailwind CSS
• Authentication: Clerk
• UI Components: React with custom components
• Real-time Updates: Server-Sent Events (SSE)

Backend

• Framework: FastAPI
• AI Integration: OpenAI API with streaming responses
• Authentication: Clerk JWT verification
• CORS: Configured for cross-origin requests

Deployment

• Containerization: Docker
• Frontend Hosting: Vercel (recommended)
• Backend Hosting: AWS App Runner / Railway / Render
• Database: Clerk (user management)

✨ Features

• 🔐 Secure Authentication - Clerk-powered user management
• 🤖 AI-Powered Summarization - GPT-4o-mini for accurate medical content generation
• 📊 Real-time Streaming - Live updates as AI generates content
• 📱 Responsive Design - Works seamlessly on desktop and mobile
• ⚡ Fast Performance - Optimized Next.js with static generation
• 🐳 Docker Ready - Easy deployment with containerization

🛠️ Tech Stack

Component	Technology	Purpose
Frontend	Next.js, TypeScript, Tailwind CSS	Modern React framework with type safety
Backend	FastAPI, Python	High-performance API server
AI	OpenAI GPT-4o-mini	Advanced language model for content generation
Auth	Clerk	User authentication and management
Styling	Tailwind CSS	Utility-first CSS framework
Deployment	Docker, Vercel	Containerization and hosting

🚀 Getting Started

Prerequisites

• Node.js 18+ and npm
• Python 3.12+
• Docker (optional, for containerized deployment)
• Clerk account for authentication
• OpenAI API key

Local Development

1. Clone the repository

   git clone https://github.com/upstackpilot0710/ai-health-consultation-platform.git
   cd ai-health-consultation-platform

2. Install frontend dependencies

   npm install

3. Install backend dependencies

   cd backend
   pip install -r requirements.txt
   cd ..

4. Environment Setup

   Create .env.local in the root directory:

   # Clerk Authentication
   NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_...
   CLERK_SECRET_KEY=sk_test_...
   CLERK_JWKS_URL=https://your-domain.clerk.accounts.dev/.well-known/jwks.json
   
   # OpenAI
   OPENAI_API_KEY=sk-...
   
   # Backend URL (for development)
   NEXT_PUBLIC_API_URL=http://localhost:8000

5. Start the backend server

   cd backend
   uvicorn server:app --reload --host 0.0.0.0 --port 8000

6. Start the frontend development server

   npm run dev

7. Open your browser

   Navigate to http://localhost:3000

Docker Deployment

1. Build the Docker image

   docker build -t medinotes-pro .

2. Run the container

   docker run -p 8000:8000 \
     -e NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=your_key \
     -e OPENAI_API_KEY=your_key \
     medinotes-pro

📁 Project Structure

ai-healthcare-consultation-saas/
├── backend/
│   ├── server.py          # FastAPI application
│   ├── requirements.txt   # Python dependencies
│   └── static/            # Built frontend files
├── pages/
│   ├── _app.tsx          # Next.js app component
│   ├── _document.tsx     # Custom document
│   ├── index.tsx         # Landing page
│   └── product.tsx       # Main application
├── public/               # Static assets
├── styles/
│   └── globals.css       # Global styles
├── Dockerfile           # Container configuration
├── next.config.ts       # Next.js configuration
├── package.json         # Node dependencies
├── tailwind.config.js   # Tailwind configuration
└── README.md           # This file

🔧 Configuration

Clerk Setup

1. Create a Clerk application at clerk.com
2. Configure authentication settings
3. Add your domain to allowed origins
4. Copy the publishable key and secret key to your environment

OpenAI Setup

1. Get your API key from OpenAI Platform
2. Add it to your environment variables
3. The app uses GPT-4o-mini for cost-effective, high-quality responses

🚀 Deployment

Frontend (Vercel)

1. Connect your GitHub repository to Vercel
2. Add environment variables in Vercel dashboard
3. Deploy automatically on push

Backend (Railway/AWS App Runner)

1. Use the provided Dockerfile
2. Set environment variables
3. Deploy to your preferred platform

🤝 Contributing

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

📄 License

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

🙏 Acknowledgments

• OpenAI for the powerful GPT models
• Clerk for seamless authentication
• Vercel for excellent hosting platform
• Next.js for the amazing React framework

📞 Support

For support, email support@medinotespro.com or join our Discord community.

---

MediNotes Pro - Transforming healthcare documentation with AI ✨

User signs in using Clerk.

Clerk issues a JWT token.

Frontend sends JWT in Authorization header.

Backend verifies JWT using Clerk JWKS.

Access granted only to subscribed users.

💳 Subscription & Feature Gating

Premium subscription required to access idea generation.

Clerk Billing manages subscription lifecycle.

component gates premium content.

Backend validates subscription before generating AI response.

⚡ Real-Time AI Streaming

The app uses:

OpenAI streaming responses

FastAPI StreamingResponse

Server-Sent Events (SSE)

fetch-event-source on frontend

This enables real-time idea generation similar to ChatGPT-style streaming.

📂 Project Structure saap/ ├── pages/ │ ├── index.tsx # Landing page │ ├── product.tsx # Premium feature page │ ├── _app.tsx # Clerk Provider │ └── _document.tsx # HTML skeleton ├── api/ │ └── index.py # FastAPI streaming backend ├── styles/ │ └── globals.css ├── README.md └── package.json 🛠️ Environment Variables

The following environment variables are required:

NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY= CLERK_SECRET_KEY= CLERK_JWKS_URL= OPENAI_API_KEY=

⚠️ Never commit .env files to GitHub.

🚀 Local Development npm install vercel dev 🌍 Production Deployment vercel --prod 📸 Demo

Add your live Vercel URL here:

https://your-vercel-app-url.vercel.app 🧩 Key Features

🔐 Secure JWT-based authentication

💳 Subscription-based feature access

⚡ Real-time AI streaming

🎨 Clean UI with Tailwind Typography

🛡️ Backend subscription enforcement

☁️ Cloud deployment with Vercel

📈 Future Improvements

Usage-based billing (token limits)

Admin dashboard

Idea history storage

User analytics

Multi-model support

👨‍💻 Author

Deepak Maurya AI/ML Engineer | GenAI Enthusiast