Toolverse
All skills

convex-realtime

by waynesutton

Patterns for building reactive apps including subscription management, optimistic updates, cache behavior, and paginated queries with cursor-based loading

Installation

Pick a client and clone the repository into its skills directory.

Installation

Quick info

Category
Security
Views
2

About this skill

Patterns for building reactive apps including subscription management, optimistic updates, cache behavior, and paginated queries with cursor-based loading

How to use

  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.

Related skills