The FlossBoss project is a web-based system for dental appointment management that combines a client/server model with a service-oriented approach to efficiently manage dental appointments. Employing a React-based Patient GUI on the front end and an Express.js server on the back end for user data handling through HTTP REST API. The system leverages MQTT as a communication protocol, where the server, instead of direct database operations for bookings, publishes booking requests and subscribes to booking confirmations, enabling real-time updates via SSE. The Service Layer encapsulates the booking logic, dentist authentication, email notifications, and logging, with services subscribing to and publishing on MQTT topics for a decoupled, event-driven workflow that provides real-time notifications, enhancing user experience and system maintainability.

This repository contains the JavaScript codebase for the client/server aspects of the system. The front end is built using React, creating a dynamic and user-friendly interface for patients, while the back end utilizes Express.js to efficiently handle user data through a RESTful API. By segregating the client/server side from the Java-based services, the project achieves a clear separation of concerns. This approach not only streamlines development but also significantly simplifies the Continuous Integration and Continuous Delivery (CI/CD) processes, ensuring smoother deployments and easier maintenance of the system.

1. System Overview
2. Technologies and Tools Used
3. Visuals
4. Installation guide
5. Authors and Acknowledgments
6. License

The repository in focus here encapsulates the client/server side of the system, as depicted on the left side of the development view diagram below. The client side, developed using JavaScript and the React framework, provides an interactive and responsive Patient Interface. This front-end setup is dedicated to offering an intuitive user experience for scheduling and managing appointments. The server side runs on Express.js and handles the Patient API, processing HTTP/REST requests to perform user operations and retrieve clinic and appointment data securely.

Additionally, the server employs MQTT and Server-Sent Events (SSE) to update the web client in real-time, ensuring immediate synchronization of appointment data and notifications for an enhanced user experience.

Front-end Development: JavaScript, React

Back-end Development: Node.js, Express, npm, JWT

Databases: MongoDB Cloud

Containerization: Docker

Messaging Protocols: MQTT (HiveMQ Cloud)

API Development and Testing: Postman

All the services and the client/server are uploaded to the projects Dockerhub page.

To run docker images on your system you need to first install the docker engine on your local system. We recommend installing the desktop version to easily keep track of your current containers and CPU usage.

Due to a current issue with the docker engine, Arm64 and Amd64 systems are not compatible with images built on the opposing architecture. To solve this problem we have images for both Arm64 and Amd64, choose the one that matches you system architecture.

1. Navigate to the repository root folder.
2. To start services run "docker compose -f compose.arm.yml up -d"
3. To exit services run "docker compose -f compose.arm.yml down"

1. Navigate to the repository root folder.
2. To start services run "docker compose -f compose.amd.yml up -d"
3. To exit services run "docker compose -f compose.amd.yml down"

• Node Package manager Link to download
• MongoDB Cloud database Link to download
• HiveMQ Cloud MQTT Broker Link to download
• Docker Desktop Link to download
• Postman Link to download

• Open the server folder (we recommend using visual studio code)
• Add a text file named ".env". Add the MONGODB_URI, MQTT URL, MQTT_USER, MQTT_PASSWORD, and SECRET_KEY.
• Open the client folder (we recommend using visual studio code)
• Add a text file named ".env". Add the REACT_APP_GOOGLE_MAPS_KEY.

• Open a terminal window in the root directory of the repository (or your preferred IDE)
• Type "cd server" and then type "npm run dev"
• Open a new terminal window in the root directory of the repository (or your preferred IDE)
• Type "cd client" and then type "npm start"

• Isaac Lindegren Ternbom
• Joel Celén
• Karl Eriksson
• Ahmand Haj Ahmad
• Malte Bengtsson
• Rizwan Rafiq

The FlossBoss project is licensed under MIT