convex-realtime

Skill do Convex umożliwia budowanie aplikacji reaktywnych w czasie rzeczywistym. Automatyczne subskrypcje danych, inteligentne cachowanie wyników zapytań, optymistyczne aktualizacje interfejsu oraz paginacja z kursorami — wszystko to pozwala na efektywne synchronizowanie stanu aplikacji z bazą danych. Komponenty React automatycznie się aktualizują, gdy zmienią się istotne dane, bez zbędnych renderowań.

1. Zainstaluj skill w swoim projekcie Convex i upewnij się, że masz dostęp do dokumentacji: https://docs.convex.dev/client/react oraz https://docs.convex.dev/client/react/optimistic-updates.

2. W komponencie React zaimportuj hook useQuery z biblioteki convex/react oraz wygenerowany plik api z folderu convex/_generated/api.

3. Użyj hooka useQuery w komponencie, przekazując funkcję API i parametry zapytania — na przykład listę zadań dla konkretnego użytkownika. Hook automatycznie utworzy subskrypcję i będzie aktualizować dane w czasie rzeczywistym.

4. Obsłuż stan ładowania — gdy useQuery zwróci undefined, wyświetl komunikat ładowania lub skeleton. Po pobraniu danych wyświetl je w interfejsie.

5. Dla warunkowych zapytań przekaż null jako parametr, aby pominąć wykonanie zapytania — hook automatycznie wznowi subskrypcję, gdy parametr będzie dostępny.

6. Zapoznaj się z dokumentacją paginacji (https://docs.convex.dev/database/pagination), aby zaimplementować kursorowe ładowanie danych dla dużych zbiorów — pozwoli to na efektywne pobieranie danych w stronach bez duplikowania wyników.