MediConnect: A Full-Stack Real-Time Hospital Appointment Management System

Abstract

This paper presents the design and implementation of MediConnect, a full-stack, real-time Hospital Appointment Management System constructed as a single-page web application (SPA) following the JAMstack architectural paradigm. The system addresses persistent inefficiencies in manual hospital appointment workflows by delivering a serverless, cloud-native platform. The architecture integrates Supabase for backend-as-a-service (BaaS) — encompassing a PostgreSQL relational database, secure email/password authentication, Row Level Security (RLS), and a WebSocket-driven Realtime engine — with EmailJS for automated browser-triggered notifications and Netlify for static hosting and global content delivery. MediConnect provides two distinct portals: a patient-facing interface enabling self-service registration, specialist browsing, appointment booking, and medical history access; and an administrator dashboard for centralised management of patients, physicians, departments, and operational records. The system achieves sub-second data propagation via WebSocket-based real-time subscriptions, ensuring consistent application state across all concurrent sessions. Experimental results confirm functional completeness, low operational overhead, and a professional-grade user experience, demonstrating that feature-rich healthcare management software can be delivered without conventional server infrastructure.

Introduction

The paper presents MediConnect, a modern hospital appointment management system designed to replace traditional manual scheduling methods such as paper registers and phone-based bookings, which often cause inefficiency, delays, and poor patient experience.

MediConnect is a full-stack web application built using a JAMstack architecture, where a static frontend is combined with backend services and real-time APIs. The system supports two main users: patients (who can register, book appointments, view medical history, and track prescriptions) and administrators (who manage doctors, departments, appointments, and system logs). A key feature is real-time updates using WebSockets, ensuring instant synchronization of appointment changes.

The system is built using modern technologies including a JavaScript-based SPA frontend and a backend powered by a cloud database and authentication service (Supabase). It uses a three-tier architecture with secure authentication, role-based access control, and a real-time notification system that updates users instantly when data changes.

The methodology includes REST-based APIs, database triggers, and a real-time event system using PostgreSQL logical replication. Deployment is handled through automated CI/CD pipelines with static hosting for fast performance and scalability.

Key modules include:

• Authentication and user management
• Patient portal for booking and tracking appointments
• Admin dashboard for hospital operations
• Real-time notification system
• Cloud-based deployment and hosting

Results show that the system significantly improves efficiency, reduces manual workload, and ensures real-time transparency in appointment management.

Future improvements include adding payment integration, telehealth (video consultation), mobile apps, analytics dashboards, and enhanced security auditing for large-scale deployment.

Conclusion

MediConnect successfully demonstrates the design and implementation of a comprehensive, end-to-end hospital appointment management system constructed entirely from modern web technologies and cloud-based SaaS platforms. By adopting a serverless, JAMstack architecture, the project delivers a production-deployable, feature-complete application requiring no traditional server infrastructure to operate or maintain. The integration of Supabase, Netlify, and EmailJS validates the efficacy of the JAMstack approach for healthcare applications: complex capabilities — including real-time data synchronisation via WebSockets, secure role-based access control enforced through database-level RLS policies, and automated transactional email communications — are achieved through well-composed third-party services rather than bespoke server code. The relational schema accurately models the structural complexity of hospital operations across eight interconnected entities, while WebSocket-based real-time subscriptions maintain consistent application state across concurrent user sessions with sub-second latency. MediConnect serves as a scalable, extensible foundation for the broader digitisation of healthcare workflows, demonstrating core competencies in full-stack web engineering: advanced relational database design, secure user authentication, event-driven system architecture, and production deployment practices. The system offers a seamless and professional experience for both patients and medical administrators alike, and its serverless nature makes it immediately accessible to healthcare providers at any scale.

References

[1] World Health Organisation, \"Strengthening Health Information Systems,\" WHO Press, Geneva, Switzerland, 2011. [2] M. A. Khan, S. Ullah, and N. Ahmad, \"Design and Implementation of a Hospital Management System Using Web Technologies,\" International Journal of Computer Science and Network Security, vol. 15, no. 3, pp. 88–94, 2015. [3] R. Gupta and A. Sharma, \"A RESTful API-Based Approach for Hospital Information System Design,\" Procedia Computer Science, vol. 125, pp. 700–706, 2018. [4] I. Fette and A. Melnikov, \"The WebSocket Protocol,\" IETF RFC 6455, December 2011. [Online]. Available: https://tools.ietf.org/html/rfc6455 [5] Google Firebase, \"Firebase Realtime Database Documentation,\" [Online]. Available: https://firebase.google.com/docs/database, Accessed: 2025. [6] M. Biilmann, \"The JAMstack: A New Front-End Stack for Web Development,\" Smashing Magazine, 2016. [Online]. Available: https://www.smashingmagazine.com

Copyright

Copyright © 2026 Prof. Sujata Tirpude, Darshan Chudasama, Meenakshi Kharat. This is an open access article distributed under the Creative Commons Attribution License, which permits unrestricted use, distribution, and reproduction in any medium, provided the original work is properly cited.