Medication Plan Management Web App
Frontend Dev
Hyphen Fellowship | Mar 2021 - May 2021
Project Overview
A single page web application built by a team of 5 developers and 1 product manager using the MERN stack to create a digital solution for our Germany based start-up client.
The application helps physicians log their patient’s information during checkups to prevent polypharmacy (use of multiple drugs for treatment) among the elderly. Polypharmacy increases the risk of conflicting side effects which could lead to other illnesses.
Our team made use of drug bank APIs and an algorithm to analyze patients’ existing medication plan, creating a risk score for possible adverse effects, and providing suggestions on how to optimize (i.e. prescribe xx mg of xx drug, reduce the total number of drugs)
What I Learned
💡 First time working with a client stakeholder
💡 Leading frontend feature discussions with a Project Manager
💡 How to deal with form handling, form validation and sending form data to backend
💡 First time implementing responsive designs
Here is the landing page of our medication plan management app.
We then get patient data using this form (created by Formik), we conduct data validation before conducting a fetch call to the backend API to send over the data.
Afterwards, the user (doctor) adds in their diagnosis of the patient, and their prescription. As the user types in their diagnosis and prescription, an autocomplete dropdown shows up. Doctors can't remember all kinds of diagnoses & drugs, so we used a drug bank API to populate the autocomplete dropdown to assist the user.
Next, to target polypharmacy, the user adds in possible symptoms and side effects from their current medication and this new prescription.
After gathering all this data we send it over to the backend, call the drunk bank API again to check the risk scores of adding the new prescription to the patient's medication plan and create a report for both the patient and the doctor.
.png)