🏥 Healthcare Symptom Checker

A modern, educational web application that provides preliminary symptom analysis using AI. Built with Next.js, TypeScript, and Tailwind CSS.

Visit Live Website at:

https://healthcare-symptom-checker-five.vercel.app/

Demo Video

https://drive.google.com/file/d/1AR_gZbIbtnRNoIVCnnUFymsf0Oi1EhPT/view?usp=sharing

🚀 Features

✨ Core Functionality

AI-Powered Analysis: Advanced symptom analysis using machine learning
Multi-Step Processing: Professional loader with 4-step analysis process
Real-time Validation: Form validation with user-friendly error messages
Responsive Design: Works perfectly on desktop, tablet, and mobile

🎨 User Experience

Modern UI/UX: Clean, professional interface with gradient designs
Interactive Loader: Engaging 13-second multi-step loading animation
Popup Results: Professional modal display for analysis results
Markdown Support: Rich text formatting in analysis results
Accessibility: WCAG compliant with proper focus management

🔒 Safety Features

Medical Disclaimers: Prominent safety warnings throughout the app
Input Validation: Age range validation and required field checks
Error Handling: Comprehensive error states and user feedback

🛠️ Technology Stack

Framework: Next.js 14 with App Router
Language: TypeScript
Styling: Tailwind CSS
Icons: Lucide React
Markdown: ReactMarkdown
State Management: React Hooks (useState, useEffect)

📦 Installation

Clone the repository

git clone https://github.com/ap-dev-github/heathcare-symptom-checker.git
cd heathcare-symptom-checker

Install dependencies

npm install
# or
yarn install
# or
pnpm install

Set up environment variables

Run the development server

npm run dev

Open your browser Navigate to http://localhost:3000

🎯 Usage

For Patients Enter Personal Details: Fill in name and age

Describe Symptoms: Provide detailed symptom description including duration, severity, and timing

Start Analysis: Click "Start Analysis" to begin AI processing

Review Results: View comprehensive analysis in the popup modal

Take Action: Follow recommendations and consult healthcare professionals

Symptom Description Tips

Be specific about duration and severity

Mention timing patterns (e.g., "worse in evenings")

Include factors that improve or worsen symptoms

Note any related symptoms or recent changes

🔧 API Integration

The application expects a POST endpoint at /api/check-symptoms:

Request Format

{
  name: string;
  age: number;
  symptoms: string;
}

Response Format

{
  result: string; // Markdown formatted analysis
  error?: string; // Optional error message
}

📱 Responsive Design

Mobile: Single column layout with optimized touch targets

Tablet: Adaptive grid layouts

Desktop: Multi-column forms with spacious design

🚨 Important Disclaimer

⚠️ MEDICAL DISCLAIMER: This application is for educational and informational purposes only. It is NOT a substitute for professional medical advice, diagnosis, or treatment. Always seek the advice of your physician or other qualified health provider with any questions you may have regarding a medical condition. In case of emergency, call your local emergency services immediately.

🔒 Privacy & Security

No personal health information is stored permanently

ap-dev-github / heathcare-symptom-checker