Skip to content

AlvinGeorge-AG/dpcfrontend

Repository files navigation

Digital Patient Card Frontend

Project Overview

The Digital Patient Card Frontend is a user-friendly React application designed to provide Patients, Doctors, and Admins seamless access to healthcare information and management tools. This frontend communicates with a powerful backend to deliver a smooth, secure, and efficient healthcare experience.


Features for Users

For Patients

  • Secure Registration & Login: Easy account creation and login with encrypted passwords.
  • Personal Dashboard: View your health profile, medical history, and disease records.
  • Disease Management: Add new medical conditions and track existing ones.
  • Profile Updates: Edit personal details like height, weight, and contact info.
  • Download Reports: Download comprehensive PDF health reports on demand.

For Doctors

  • Doctor Login: Access your professional dashboard securely.
  • Patient Search: Quickly find patients by username.
  • Disease Verification: Approve or reject reported diseases.
  • Referral Management: Refer patients to specialists and track referrals.

For Admins

  • Admin Login: Secure portal for system management.
  • User Management: Approve doctors, delete users, and manage roles.
  • Dashboard Overview: View analytics across doctors and patients.

Technologies Used

  • React 18 for building responsive user interfaces
  • React Router v6 for client-side routing
  • Fetch/Axios for API calls to backend services
  • Netlify/Vercel for deployment with custom routing configurations
  • CSS3 and Flexbox/Grid for layout and styling

Installation & Setup

Prerequisites

  • Node.js and npm installed
  • Backend API running and accessible

Setup Steps

  1. Clone the frontend repository:

    git clone https://github.com/Ewanjohndennis/dpcfrontend

  2. Navigate into the project directory and install dependencies:

    cd digital-patient-card-frontend npm install

  3. Configure environment variables (if applicable) for backend API URL.

  4. Start the development server:

    npm run dev

Usage Instructions

Patient Workflow

  • Register or login to your account securely.
  • Explore your personal dashboard to view and manage your health records.
  • Add diseases by filling out the condition details.
  • Download your health report as a PDF anytime.

Doctor Workflow

  • Login with your professional credentials.
  • Search for patients and view their medical histories.
  • Verify or update disease status.
  • Refer patients to other doctors seamlessly.

Admin Workflow

  • Authenticate with admin credentials.
  • View system-wide data and manage user access.
  • Approve new doctor registrations and remove users if necessary.

Support and Troubleshooting

  • Ensure backend APIs are running and reachable.
  • Configure environment variables correctly.
  • For routing issues, refer to routing notes above.
  • Check browser console for JavaScript errors.
  • Contact support via your healthcare provider or project maintainer.

Contribution Guidelines

We welcome contributions from the developer community! Please fork the repo and submit pull requests for bug fixes, features, or UI improvements. For significant features, please open an issue first for discussion.


Contact Information

For questions, suggestions, or support, please contact:
[Your Name] - your.email@example.com


Thank you for using the Digital Patient Card Frontend. We hope it makes managing your healthcare simpler and more efficient!

About

Fork from Ewan dpcfrontend

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors