BloodLink

Inspiration

I was inspired after hearing about my father mentioning the issues associated with blood donations as he works at a cancer hospital, and patients with leukemia or other diseases often face an issue with receiving donations, despite so many technological advancements today. I decided that this hackathon was an appropriate avenue to tackle this pertinent issue.

What is it?

BloodLink is a web application that aims to allow for communication and effective blood donation between a donor and a patient that is affiliated with a hospital. The web application allows a user to authorize and register themselves as a blood donor, involving various details such as medical history, which allows all their medical history and information to be accessible when necessary. The donor can view a dashboard with information regarding patients, so that they know when there is an urgent need for a blood donation. It addresses the issue of a lack of communication between parties when it comes to blood donation, due to a lack of a singular database where information can be securely stored, which results in blood being wasted in blood banks and hospitals. Additionally, many patients also require specific components of blood. For example, platelet donation is not as common, and thus my web app could focus on such cases. It is easily accessible through both mobile and PC, with effective UX and UI choices.

Creation

Once I finalized my idea, I set about observing the tech stack for my project - the tools and technologies used are below. My development process usually entails creating the placeholder files and folders so that I am organized and can ensure it is streamlined, as well as carefully installing the necessary dependencies as NodeJS, in my personal experience, can sometimes involve various errors.

Frontend:

• Nextjs - A reliable and fast framework
• Mantine - Aesthetically appealing components for my website
• TypeScript - Increased scalability and productivity
• Axios - HTTP client for NodeJS and Browser

Backend:

• Prisma - An object relational mapper (ORM) to write SQL
• Nestjs - Serverside NodeJS applications
• Supabase - An open source Firebase alternative

What I learned

Through this project, I have been able to explore the creation process of a web app that focuses on healthcare and one that has far reaching impacts in the public sector. I learned the importance of authentication through JSON Web Tokens to protect user data, and the databases (backend) involved in this project to store information in an organised manner.

What's Next?

I aim to keep working on my project and refine it to the extent that I could see the viability of it in a public forum, perhaps through testing, working with hospitals, and observing ways in which it can improve. This would also involve the transition of it being a web app to a mobile app.

Challenges

• A challenge that I faced was managing the various parties associated with the application, from the donors to the patients. Originally, I wanted hospitals to liaison with my web app as well, but I then realized that this would be inefficient and unnecessary, and thus removed it from my project.
• A challenge I ran into was time management. Despite having a few days' time to complete the project, it was during the school week, and working on it consistently proved to be a difficult task. Nevertheless, I managed to achieve my intended product outcome.

Built With

• axios
• javascript
• mantine
• nest
• next
• node.js
• postgresql
• prisma
• react
• supabase
• typescript