My workplace recently adopted FMX as a platform for managing facility resources and availability. The platform provides robust scheduling capabilities and has proven invaluable for managing room bookings and resource allocation across our district.
However, we quickly identified a gap in our implementation: the need for clear, real-time displays outside each conference room showing current and upcoming bookings. While there are commercial products available that offer this functionality, FMX doesn't provide dedicated display hardware or a standalone display solution. What they do offer, though, is a comprehensive API - and that's where my journey began.
At its core, the application serves as a bridge between FMX's scheduling API and a user-friendly display interface. The system pulls scheduling data for specific resources (conference rooms) and presents current and upcoming meetings in an easy-to-read format. One of the key technical challenges was handling different types of recurring meetings - weekly schedules, custom frequencies, and one-time events - while ensuring proper timezone handling and date formatting.
The architecture employs a service-based approach, with a dedicated FMX service handling all API interactions and data transformations. This separation of concerns makes the code more maintainable and allows for easier updates to the API integration layer. The front end utilizes React's built-in hooks (useState, useEffect) for state management and side effects, while Tailwind CSS provides responsive styling capabilities.
A notable feature is the settings management system, which allows for dynamic configuration of building and resource IDs. These settings are persisted in localStorage, making the display units configurable without requiring code changes. For date and time handling, the application uses the native JavaScript Date API for managing UTC and timezone conversions.
If you're interested in this project, you can check it out on GitHub for more details.