Healthcare Benchmarking & DIY Ads
Enterprise SaaS for Hospital Analytics & Advertising
Built schema-driven UI rendering engine for dynamic report construction — backend returns JSON schema, React recursively renders Cards, Charts, Tables, and Forms. MobX store-per-domain architecture with computed properties across auth, organization, queries, and reports stores. ag-Grid for complex data tables and Chart.js for 20+ KPI visualization modules.
Key Features
- Schema-driven UI engine — React recursively renders components from backend JSON schema
- 100+ unique KPI visualizations with Chart.js (Bar, Line, Doughnut, Stacked charts)
- MobX store-per-domain: auth, organization, queries, reports stores with computed properties
- ag-Grid data tables with complex sorting, filtering, and drill-down capabilities
- Multi-step Query Tool wizard with complex state management
- Responsive design supporting desktop, tablet, and mobile form factors
Tech Stack
Frontend
Data Visualization
Tools
Cloud & Auth
Backend
Challenges & Solutions
Schema-Driven Report Constructor
100+ unique KPIs each with different visualization requirements, calculations, and drill-down capabilities — hardcoding each report layout would be unmaintainable and block business users from configuring new reports.
Built recursive rendering engine where backend returns JSON schema describing layout (Container, Row, Card, Charts, Tables, Forms). React walks the schema tree and instantiates appropriate components. Non-developers can configure new report layouts without code changes.
Enterprise State Management at Scale
Multiple interconnected MobX stores (auth, organization, queries, reports) with complex async flows, cross-store dependencies, and side effects across a large healthcare domain.
Store-per-domain architecture with MobX computed properties for derived state and reactions for side effects. Each store owns its data and exposes computed values — report store reacts to query store changes automatically. Kept state predictable despite 100+ KPI variations.
Stripe Manual Capture for Ad Campaigns
DIY Ads needed to authorize payment on checkout but only capture when campaign actually launches — standard charge flow would lock user funds prematurely.
Implemented Stripe PaymentIntents with manual capture: authorize on checkout, capture on campaign launch, void on cancellation. Event-driven campaign status workflow using Symfony EventDispatcher triggers appropriate payment actions at each state transition.