convex-realtime

Synchronize React application state with Convex data in real time.

1|Updated Oct 10, 2025

Search Tags:#subscriptions #react #realtime #pagination #convex #optimistic-updates

Ready to run

npx skills add https://github.com/cgRGM/rivercitymd --skill convex-realtime-cgrgm

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: convex-realtime
Source: https://github.com/cgRGM/rivercitymd/tree/main/.cursor/skills/convex-realtime
Command: npx skills add https://github.com/cgRGM/rivercitymd --skill convex-realtime-cgrgm

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It helps you build React interfaces that stay synchronized with Convex data automatically, eliminating manual polling and reducing state-management complexity.

Core Features & Use Cases

Real-time subscriptions: Automatically refresh UI when queried data changes.
Optimistic updates: Show immediate feedback for creates, toggles, and edits before the server responds.
Pagination and infinite scroll: Load large datasets efficiently with cursor-based paging.
Conditional querying: Skip queries safely until required identifiers or inputs are available.
Use case: Ideal for dashboards, chat systems, appointment boards, task lists, and admin portals that need live, consistent updates.

Quick Start

Ask for a Convex React pattern that uses real-time queries, optimistic mutations, and paginated loading for your app.

Frequently Asked Questions about convex-realtime

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I sync React state with Convex data in real time?▼

To sync React state with Convex in real time, use subscription-driven queries like useQuery that automatically refresh the UI when underlying data changes, eliminating manual polling and keeping dashboards consistent.

What's the best way to handle optimistic updates in a Convex React app?▼

Handle optimistic updates in Convex by applying immediate local state changes for creates, toggles, or edits using useMutation before the server responds, then reconciling the UI automatically once the server confirms the mutation.

How do I implement cursor-based pagination for a Convex chat or task list?▼

Implement cursor-based pagination in Convex using usePaginatedQuery to load large datasets efficiently, enabling infinite scroll for chat systems and task lists while maintaining explicit loading-state handling for consistent updates.

Can I skip Convex queries conditionally until required inputs are available?▼

Yes, you can skip Convex queries conditionally using skip-based conditional loading to prevent unnecessary data fetching until required identifiers or inputs are available, maintaining efficient and safe subscription-driven data flows.

Do I need explicit loading states for Convex paginated queries?▼

Yes, explicit loading-state handling is required for Convex paginated queries to keep updates consistent and efficient, ensuring UI components properly reflect data fetching transitions during cursor-based pagination and real-time subscription updates.