https://github.com/letstri/tanstack-db-pglite
https://github.com/letstri/tanstack-db-pglite
Last synced: 11 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/letstri/tanstack-db-pglite
- Owner: letstri
- License: mit
- Created: 2025-09-14T21:03:24.000Z (11 months ago)
- Default Branch: main
- Last Pushed: 2025-09-14T22:23:22.000Z (11 months ago)
- Last Synced: 2025-09-15T00:22:21.049Z (11 months ago)
- Language: TypeScript
- Size: 38.1 KB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# tanstack-db-pglite
A seamless integration between [TanStack DB](https://tanstack.com/db) and [PGLite](https://github.com/electric-sql/pglite) with [Drizzle ORM](https://orm.drizzle.team/) for browser-based database management.
## Installation
```bash
npm install tanstack-db-pglite @tanstack/db drizzle-orm @electric-sql/pglite
```
> **Note:** `@tanstack/db` and `drizzle-orm` are peer dependencies and must be installed separately.
## Quick Start
```typescript
import { PGLite } from '@electric-sql/pglite'
import { createCollection } from '@tanstack/react-db'
import { drizzle } from 'drizzle-orm/pglite'
import { drizzleCollectionOptions } from 'tanstack-db-pglite'
import { chats } from '~/drizzle'
const pglite = new PGLite()
const db = drizzle(pglite)
export const chatsCollection = createCollection(drizzleCollectionOptions({
db,
table: chats,
primaryColumn: chats.id,
prepare: async () => {
// Prepare your database before starting the collection (e.g., run migrations)
await waitForMigrations()
},
sync: async ({ collection, write }) => {
// Send some data to your backend to sync and receive the response
const sync = await syncWithCloud(
collection.toArray.map(c => ({
id: c.id,
updatedAt: c.updatedAt
}))
)
sync.forEach((item) => {
if (item.type === 'delete') {
write({ type: 'delete', value: collection.get(item.value)! })
}
else {
write(item)
}
})
},
onInsert: async (params) => {
await saveInCloud(params)
},
onUpdate: async (params) => {
await updateInCloud(params)
},
onDelete: async (params) => {
await deleteInCloud(params)
},
}))
```