Dynamiczne widoki dla systemu medycznego
Automatyzacja task boardów z wykorzystaniem Material Data Grid i Firebase.
- Klient: firma z branży medtech rozwijająca aplikację do zarządzania danymi medycznymi
- Problem: potrzeba stworzenia widoków (grid i kanban), które dynamicznie reagują na zdarzenia w systemie
- Rozwiązanie: implementacja dynamicznego grida z konfiguracją drag&drop oraz integracja powiadomień przez Firebase Cloud Messaging
- Etap: widok grid zaimplementowany i gotowy do integracji; kanban zaplanowany na kolejny etap
- Rola Team Connect: Frontend Engineer odpowiedzialny za dobór technologii i implementację komponentów we wczesnej fazie projektu
Kontekst
Frontend Engineer z Team Connect dołączył do zespołu klienta jako ekspert odpowiedzialny za rozwój interfejsów opartych na dynamicznych zdarzeniach systemowych. Klient rozwija narzędzia wspierające zarządzanie opieką medyczną i danymi pacjentów w czasie rzeczywistym.
Zapotrzebowanie dotyczyło budowy dwóch widoków: grid oraz kanban. Każdy z nich miał działać w trybie live – odświeżać się automatycznie w reakcji na określone zdarzenia systemowe, takie jak oznaczenie danej obserwacji jako ważnej przez lekarza.
Wyzwanie
Ze względu na wysoką dynamikę projektu i potrzebę szybkiego dostarczenia funkcjonalności, konieczne było sprawne dobranie gotowych komponentów oraz rozwiązań, które zapewnią oczekiwany poziom użyteczności przy zachowaniu optymalizacji kosztowej.
Kluczowe wymagania obejmowały:
- pełną konfigurowalność widoku (kolumny, sortowanie, filtrowanie, kolejność elementów),
- działanie w czasie rzeczywistym (live view),
- przesuwanie tasków między statusami (dla kanbana),
- efektywne wykorzystanie budżetu i zasobów.
Rozpoznanie i decyzje technologiczne
Frontend Engineer przeanalizował dostępne biblioteki open source oraz rozwiązania komercyjne, szukając narzędzi, które spełnią wymagania klienta bez potrzeby budowy komponentów od zera.
Finalnie zdecydowano się na:
- Material Data Grid Pro – płatną bibliotekę spełniającą wymogi konfiguracyjne (drag&drop, filtrowanie, zmiana kolejności),
- Firebase Cloud Messaging – do obsługi notyfikacji systemowych w czasie rzeczywistym (rozwiązanie bezpłatne, łatwe do integracji z Angular i React).
Rozwiązanie
Zrealizowano pierwszy widok (grid) z pełną konfiguracją interfejsu. Dane są filtrowalne, sortowalne, a kolejność kolumn i wierszy można ustawiać metodą drag&drop.
Obecnie trwają prace nad integracją z Firebase, która umożliwi automatyczne odświeżanie danych w tle. Eventy są już przygotowane.
W kolejnym etapie przewidziano rozwój widoku kanban. Będzie on bazować na istniejącym komponencie do obsługi widgetów, z dodatkową logiką migracji tasków między statusami i powiązanymi akcjami w tle.
Postępy
Projekt jest w trakcie realizacji. Zespół wdrożył już widok grid z pełną konfiguracją interfejsu użytkownika, a obecnie pracuje nad integracją z systemem powiadomień opartym na Firebase. Równolegle trwają przygotowania do budowy widoku kanban, który zostanie oparty na istniejącym komponencie i rozszerzony o logikę zmiany statusów.
Etap prac – podsumowanie
- Widok grid: skonfigurowany, gotowy do integracji z systemem notyfikacji
- Live update: eventy przygotowane, integracja z Firebase w toku
- Kanban: komponent w planie, bazujący na wcześniejszym rozwiązaniu dla widgetów
- Współpraca ongoing: kolejne sprinty obejmą rozwój funkcjonalności live i logiki statusów
Zastanawiasz się, jak usprawnić swój produkt?
Tworzenie dynamicznych interfejsów to nie tylko kwestia technologii – to sposób na lepsze doświadczenie użytkownika, efektywniejsze procesy i większą kontrolę nad danymi w czasie rzeczywistym.
Zobacz, jak łączymy frontend, integracje i architekturę systemu, wspierając klientów w rozwoju aplikacji webowych.
Poznaj nasze podejście do aplikacji i portali webowych.
