UX for all

Badge claimed: Client Side Salsa

Desktop real-time data Dashboard

Our dashboard and QR code gathering interfaces were both built into the same modern React SPA web app, hosted as an Azure Static Web App, with a dedicated backend-for-frontend (Azure Functions) to provide an added layer or security with regards to accessing our data in Dataverse. The backend uses the Dataverse Web API through tokens retrieved using a Managed Identity, all being abstracted from the frontend itself.

The frontend uses SWR for data-fetching with caching, revalidation, and request deduplication, making sure of performance and stability.

Web app routing is handled with React Router, efficiently utilizing the browser’s own History API for snappy navigation.

Best practices for code structure (and source control) secures maintainability and allows for efficient collaboration.

Using Tailwind for CSS styling and a mobile-first approach, a holistic and performant UX provides responsiveness and cross-device support:

Mobile QR code gathering interface
Mobile version of the dashboard interface