ElectricSQL + TanStack DB Sync Setup
CommunityReal-time data sync for web apps.
Software Engineering#offline-first#sveltekit#tanstack-db#real-time sync#electricSQL#database synchronization
Authorshotleybuilder
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill addresses the complexity of setting up and maintaining real-time data synchronization between a PostgreSQL database and web browser clients using ElectricSQL and TanStack DB, preventing common pitfalls like browser crashes and sync bugs.
Core Features & Use Cases
- Official Sync Pattern: Guides users to the correct
electricCollectionOptionspattern for robust ElectricSQL integration. - Pitfall Avoidance: Details and provides solutions for common issues like syncing generated columns, TypeScript type constraints, and inefficient updates.
- Use Case: A developer building an offline-first SvelteKit application needs to ensure data is synced seamlessly between the client and server. This Skill provides the exact patterns and code examples to achieve this reliably.
Quick Start
Use the ElectricSQL + TanStack DB Sync Setup skill to configure real-time data synchronization for a new resource in your SvelteKit application.
Dependency Matrix
Required Modules
@tanstack/db@tanstack/electric-db-collection@electric-sql/client
Components
scriptsreferences
💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: ElectricSQL + TanStack DB Sync Setup Download link: https://github.com/shotleybuilder/sertantai-legal/archive/main.zip#electricsql-tanstack-db-sync-setup Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.