Why fetch when

you can sync?

Swap out your queries, data fetching and caching for bulletproof sync.

Quickstart
Star on GitHub

Sync your Postgres data wherever you need it ​

Electric syncs little subsets of your Postgres data into local apps, services and environments. So you can have the data you need, in-sync, wherever you need it.

Sync

Sync subsets of your Postgres data into local apps and environments.

Cloud

Hosted Electric sync that's blazing fast and scales to millions of users.

PGlite

Sync into a lightweight WASM Postgres with real-time, reactive bindings.

Makes manual data fetching obsolete ​

Why build APIs and write code to fetch data over the network when you can just sync instead?

Use cases diagrammeUse cases diagramme

Solves the hard problems, so you don't have to ​

Electric solves data loading, cache invalidation, scaling and availability.

Solves state transfer

Replace APIs, data fetching and network error handling with data synchronisation.

  • Simplifies your code
  • No loading spinners

Solves cache invalidation

Replace ttls and expiry policies with realtime sync and automated invalidation.

  • Simplifies your stack
  • No more stale data

Solves scaling

Take the query workload off your database and the compute workload off your cloud.

  • Simplifies your infra
  • Reduces your cloud bill

Solves availability

Take the network off the interaction path and build software that works offline and is resilient by design.

  • Simplifies your ops
  • No more broken apps

Get started now ​

You can start by adopting Electric incrementally, one data fetch at a time.

tsx
import { useShape } from '@electric-sql/react'

const Component = () => {
  const { data } = useShape({
    url: `${BASE_URL}/v1/shape`,
    table: `items`
  })

  return (
    <pre>{ JSON.stringify(data) }<pre>
  )
}
Quickstart
API docs

And you can level-up to syncing into a local embedded PGlite database.

tsx
import { PGlite } from '@electric-sql/pglite'
import { live } from '@electric-sql/pglite/live'
import { electricSync } from '@electric-sql/pglite-sync'
import { useLiveQuery } from '@electric-sql/pglite-react'

// Create a persistent local PGlite database
const pg = await PGlite.create({
  dataDir: 'idb://my-database',
  extensions: {
    electric: electricSync(),
    live
  }
})

// Setup the local database schema
await pg.exec(`
  CREATE TABLE IF NOT EXISTS items (
    id SERIAL PRIMARY KEY,
  );
`)

// Establish a persistent shape subscription
await pg.electric.syncShapeToTable({
  // TODO update this when the sync plugin is updated.
  url: `${BASE_URL}/v1/shape`,
  table: 'items',
  primaryKey: ['id'],
})

// Bind data to your components using live queries
// against the local embedded database
const Component = () => {
  const items = useLiveQuery(
    `SELECT * FROM items;`
  )

  return (
    <pre>{JSON.stringify(items)}<pre>
      )
}
Learn more
Star on GitHub