From f108ae251536717122cd94f44828c65253dc0428 Mon Sep 17 00:00:00 2001 From: Sam Willis Date: Wed, 1 May 2024 19:42:44 +0100 Subject: [PATCH 1/6] First draft PG client docs --- docs/api/clients/typescript.md | 6 +- docs/integrations/drivers/_category_.yml | 2 +- docs/integrations/drivers/index.md | 4 +- .../integrations/drivers/other/_category_.yml | 2 +- .../drivers/server/_category_.yml | 2 +- .../server/{node.md => better-sqlite3.md} | 2 +- docs/integrations/drivers/server/pglite.md | 53 ++++++++++++++++ docs/integrations/drivers/server/postgres.md | 54 ++++++++++++++++ docs/integrations/drivers/web/_category_.yml | 2 +- docs/integrations/drivers/web/pglite.md | 61 +++++++++++++++++++ docs/quickstart/_setup_manual.md | 2 +- docs/quickstart/index.md | 2 +- docs/reference/architecture.md | 12 ++-- docs/top-level-listings/integrations.md | 2 +- docs/top-level-listings/reference.md | 2 +- docs/usage/data-access/client.md | 4 +- docs/usage/data-access/shapes.md | 6 +- docs/usage/data-modelling/types.md | 6 +- 18 files changed, 196 insertions(+), 28 deletions(-) rename docs/integrations/drivers/server/{node.md => better-sqlite3.md} (98%) create mode 100644 docs/integrations/drivers/server/pglite.md create mode 100644 docs/integrations/drivers/server/postgres.md create mode 100644 docs/integrations/drivers/web/pglite.md diff --git a/docs/api/clients/typescript.md b/docs/api/clients/typescript.md index 1fbaea3dad..20508c399b 100644 --- a/docs/api/clients/typescript.md +++ b/docs/api/clients/typescript.md @@ -10,7 +10,7 @@ sidebar_position: 10 The Typescript client provides a number of functions for developing front-end applications with Electric: - [Authenticating](../../usage/auth/) with the sync service -- [Synchronising database](#shapes) to a local SQLite database +- [Synchronising database](#shapes) to a local SQLite, PGlite or Postgres database - [Type-safe data access](#queries) to read and update the database - [Reactive live queries](#live-queries) that update in realtime as the database changes @@ -18,11 +18,11 @@ The Typescript client provides a number of functions for developing front-end ap A Typescript client comprises of: -1. SQLite database connection from a [supported driver](../../integrations/drivers/) +1. A SQLite, PGlite or Postgres database connection from a [supported driver](../../integrations/drivers/) 2. A client schema [generated using the generator command](../cli.md#generate) 3. A [configuration object](#configuration) -To instantiate the client, these are passed to an `electrify` function that is specific to your SQLite database driver and platform. +To instantiate the client, these are passed to an `electrify` function that is specific to your database driver and platform. ```ts import { schema } from './generated/client' diff --git a/docs/integrations/drivers/_category_.yml b/docs/integrations/drivers/_category_.yml index 3ec3b5c03c..509c8703d3 100644 --- a/docs/integrations/drivers/_category_.yml +++ b/docs/integrations/drivers/_category_.yml @@ -1,6 +1,6 @@ customProps: description: >- - Adapt the SQLite database driver for your target environment. + Adapt the SQLite or Postgres database driver for your target environment. hide_overview: true icon: /img/icons/nodejs.png link: diff --git a/docs/integrations/drivers/index.md b/docs/integrations/drivers/index.md index 4a79abc70a..e6e85c8fc3 100644 --- a/docs/integrations/drivers/index.md +++ b/docs/integrations/drivers/index.md @@ -5,11 +5,11 @@ sidebar_position: 10 import DocCardList from '@theme/DocCardList'; -Adapt the SQLite database driver for your target environment. +Adapt the local SQLite, PGlite or Postgres database driver for your target environment. ## How drivers work -ElectricSQL works with existing SQLite database drivers. Connect to your local SQLite database using your existing driver library. Then pass the database `conn` to your driver adapter's `electrify` function when [instantiating your Client](../../usage/data-access/client.md#instantiating-the-client). +The ElectricSQL client works with existing SQLite and Postgres database drivers as well as [PGlite](http://github.com/electric-sql/pglite/), our WASM build of Postgres. Connect to your local database using your existing driver library. Then pass the database `conn` to your driver adapter's `electrify` function when [instantiating your Client](../../usage/data-access/client.md#instantiating-the-client). ## Supported drivers diff --git a/docs/integrations/drivers/other/_category_.yml b/docs/integrations/drivers/other/_category_.yml index ac29acc068..95c4366a97 100644 --- a/docs/integrations/drivers/other/_category_.yml +++ b/docs/integrations/drivers/other/_category_.yml @@ -1,7 +1,7 @@ label: Other customProps: description: >- - Create your own SQLite driver adapter. + Create your own SQLite or Postgres driver adapter. hide_overview: true icon: /img/icons/other.svg position: 40 diff --git a/docs/integrations/drivers/server/_category_.yml b/docs/integrations/drivers/server/_category_.yml index 73874efaa9..caeba16da9 100644 --- a/docs/integrations/drivers/server/_category_.yml +++ b/docs/integrations/drivers/server/_category_.yml @@ -1,7 +1,7 @@ label: Server customProps: description: >- - SQLite driver adapters for the server. + SQLite and Postgres driver adapters for NodeJS on the server. hide_overview: true icon: /img/icons/nodejs.png position: 30 diff --git a/docs/integrations/drivers/server/node.md b/docs/integrations/drivers/server/better-sqlite3.md similarity index 98% rename from docs/integrations/drivers/server/node.md rename to docs/integrations/drivers/server/better-sqlite3.md index f9fd88627c..97007b5244 100644 --- a/docs/integrations/drivers/server/node.md +++ b/docs/integrations/drivers/server/better-sqlite3.md @@ -1,5 +1,5 @@ --- -title: NodeJS +title: better-sqlite3 --- ElectricSQL supports [Node.js](https://nodejs.org) server application using the [better-sqlite3](https://github.com/WiseLibs/better-sqlite3) driver. diff --git a/docs/integrations/drivers/server/pglite.md b/docs/integrations/drivers/server/pglite.md new file mode 100644 index 0000000000..9485ae78be --- /dev/null +++ b/docs/integrations/drivers/server/pglite.md @@ -0,0 +1,53 @@ +--- +title: PGlite +--- + +ElectricSQL supports [Node.js](https://nodejs.org) server application using using [PGlite](https://github.com/electric-sql/pglite/), our lightweight WebAssembly build of Postgres. + +## Dependencies + +Add `@electric-sql/pglite` as a dependency to your app, e.g.: + +```shell +npm install @electric-sql/pglite +``` + +See the [PGlite repo](https://github.com/electric-sql/pglite/) for more information. + +## Usage + +```tsx +import { electrify } from 'electric-sql/pglite' +import { PGlite } from '@electric-sql/pglite' + +// Import your generated database schema. +import { schema } from './generated/client' + +// Define custom configuration if needed +const config = { + url: 'https://example.com:5133' +} + +// Create the PGlite database connection. The first argument +// is your database name. Changing this will create/use a new +// local database file. +const conn = new PGlite('/path/to/postgres/datadir') + +// Instantiate your electric client. +const electric = await electrify(conn, schema, config) + +// Connect to Electric, passing along your authentication token +// See Usage -> Authentication for more details. +await electric.connect('your token') +``` + +You can now use the client to read, write and sync data, e.g.: + +```tsx +const { db } = electric + +const results = await db.projects.findMany() +console.log(results) +``` + +See and for more information. diff --git a/docs/integrations/drivers/server/postgres.md b/docs/integrations/drivers/server/postgres.md new file mode 100644 index 0000000000..272d20a4d9 --- /dev/null +++ b/docs/integrations/drivers/server/postgres.md @@ -0,0 +1,54 @@ +--- +title: node-postgres +--- + +ElectricSQL supports [Node.js](https://nodejs.org) server application using the [node-postgres](https://node-postgres.com) driver. + +## Dependencies + +Add `pg` as a dependency to your app, e.g.: + +```shell +npm install pg +``` + +## Usage + +```tsx +import pg from 'pg' +import { electrify, ElectricDatabase } from 'electric-sql/node-postgres' + +// Import your generated database schema. +import { schema } from './generated/client' + +// Define custom configuration if needed +const config = { + url: 'https://example.com:5133' +} + +// Create the node-postgres database connection. +const client = new pg.Client({ + // Connection configuration, see: + // https://node-postgres.com/apis/client +}) +await client.connect() + +// Instantiate your electric client. +const conn = ElectricDatabase(client, 'name-of-database') +const electric = await electrify(conn, schema, config) + +// Connect to Electric, passing along your authentication token +// See Usage -> Authentication for more details. +await electric.connect('your token') +``` + +You can now use the client to read, write and sync data, e.g.: + +```tsx +const { db } = electric + +const results = await db.projects.findMany() +console.log(results) +``` + +See and for more information. diff --git a/docs/integrations/drivers/web/_category_.yml b/docs/integrations/drivers/web/_category_.yml index 9d36998051..54ba9f6ef3 100644 --- a/docs/integrations/drivers/web/_category_.yml +++ b/docs/integrations/drivers/web/_category_.yml @@ -1,7 +1,7 @@ label: Web customProps: description: >- - SQLite driver adapters for the web. + SQLite and Postgres driver adapters for the web. hide_overview: true icon: /img/icons/firefox.svg position: 10 diff --git a/docs/integrations/drivers/web/pglite.md b/docs/integrations/drivers/web/pglite.md new file mode 100644 index 0000000000..9667031409 --- /dev/null +++ b/docs/integrations/drivers/web/pglite.md @@ -0,0 +1,61 @@ +--- +title: PGlite +--- + +ElectricSQL supports running in the web browser using [PGlite](https://github.com/electric-sql/pglite/), our lightweight WebAssembly build of Postgres that supports in-browser persistence using IndexedDB. + +## Dependencies + +Add `@electric-sql/pglite` as a dependency to your app, e.g.: + +```shell +npm install @electric-sql/pglite +``` + +See the [PGlite repo](https://github.com/electric-sql/pglite/) for more information. + +## Usage + +```tsx +import { electrify } from 'electric-sql/pglite' +import { PGlite } from '@electric-sql/pglite' + +// Import your generated database schema. +import { schema } from './generated/client' + +// Define custom configuration if needed +const config = { + url: 'https://example.com:5133' +} + +// Create the PGlite database connection. The first argument +// is your database name. Changing this will create/use a new +// local database file. +// PGlite uses a `idb://` prefix to specify that the database +// is stored in indexedDB. +const conn = new PGlite('idb://electric.db', { + // You can optionally use the relaxed durability mode to + // improve responsiveness. + // This schedules flush to indexedDB for after a query has + // returned. + relaxedDurability: true, +}) + +// Instantiate your electric client. +const electric = await electrify(conn, schema, config) + +// Connect to Electric, passing along your authentication token +// See Usage -> Authentication for more details. +await electric.connect('your token') +``` + +You can now use the client to read, write and sync data, e.g.: + +```tsx +const { db } = electric + +const results = await db.projects.findMany() +console.log(results) +``` + +See the [examples/web-wa-sqlite](https://github.com/electric-sql/electric/tree/main/examples/web-wa-sqlite) demo app, and for more information. diff --git a/docs/quickstart/_setup_manual.md b/docs/quickstart/_setup_manual.md index ccc0137ccb..969668a623 100644 --- a/docs/quickstart/_setup_manual.md +++ b/docs/quickstart/_setup_manual.md @@ -36,7 +36,7 @@ See for more info. ### Typescript client -Add the `electric-sql` library to your web or mobile app, along with an [SQLite driver](../integrations/drivers/index.md): +Add the `electric-sql` library to your web or mobile app, along with an [SQLite or Postgres driver](../integrations/drivers/index.md): ```shell npm install electric-sql diff --git a/docs/quickstart/index.md b/docs/quickstart/index.md index 7d25262ba0..9312e925b8 100644 --- a/docs/quickstart/index.md +++ b/docs/quickstart/index.md @@ -76,7 +76,7 @@ ELECTRIC GRANT ALL ### Instantiate -Wrap your [SQLite driver](../integrations/drivers/index.md) with a type-safe, schema-aware [database Client](../usage/data-access/client.md): +Wrap your local [SQLite or Postgres driver](../integrations/drivers/index.md) with a type-safe, schema-aware [database Client](../usage/data-access/client.md): ```tsx import { electrify, ElectricDatabase } from 'electric-sql/wa-sqlite' diff --git a/docs/reference/architecture.md b/docs/reference/architecture.md index f178a1632c..d096f5a879 100644 --- a/docs/reference/architecture.md +++ b/docs/reference/architecture.md @@ -20,7 +20,7 @@ ElectricSQL has three primary components. [Postgres](../usage/installation/postg [![High level component diagramme](./_images/high-level-components.png)](./_images/high-level-components.jpg) -Inside the Client there is a [generated](../api/cli.md#generate) type-safe [data access library](../usage/data-access/client.md). A [satellite replication process](https://github.com/electric-sql/electric/blob/main/clients/typescript/src/satellite/process.ts) (per named local database), SQLite [driver adapters](../integrations/drivers/index.md) and a [reactivity system](#reactivity) with [front-end framework integrations](../integrations/frontend/index.md). +Inside the Client there is a [generated](../api/cli.md#generate) type-safe [data access library](../usage/data-access/client.md). A [satellite replication process](https://github.com/electric-sql/electric/blob/main/clients/typescript/src/satellite/process.ts) (per named local database), SQLite or Postgres [driver adapters](../integrations/drivers/index.md) and a [reactivity system](#reactivity) with [front-end framework integrations](../integrations/frontend/index.md). ### Topology @@ -50,7 +50,7 @@ This library and the migrations are imported into the local app. When the app [i ### Runtime changes -When the client connects to the replication stream over the [Satellite protocol](../api/satellite.md), the system verifies that the local app and server have compatible migrations. New migrations streamed into Electric over logical replication are then streamed into the clients over the Satellite protocol and applied to the local SQLite database. +When the client connects to the replication stream over the [Satellite protocol](../api/satellite.md), the system verifies that the local app and server have compatible migrations. New migrations streamed into Electric over logical replication are then streamed into the clients over the Satellite protocol and applied to the local database. This is done with [transactional causal consistency](./consistency.md). The DDL changes are marked as causal dependencies of any subsequent DML changes using that schema version, ensuring that the DDL changes are applied before any writes relying on them. @@ -59,7 +59,7 @@ This is done with [transactional causal consistency](./consistency.md). The DDL Data is synced onto local devices using [Shape subscriptions](../usage/data-access/shapes.md). Once data is synced into the local database, it can be queried using [static](../usage/data-access/queries.md#static-queries) and [live queries](../usage/data-access/queries.md#live-queries). -Local writes to SQLite are copied by triggers into the "oplog", a system table that keeps a log of pending write operations. In the local client app, the satellite process is in charge of replicating these operations over the [Satellite protocol](../api/satellite.md). +Local writes are copied by triggers into the "oplog", a system table that keeps a log of pending write operations. In the local client app, the satellite process is in charge of replicating these operations over the [Satellite protocol](../api/satellite.md). [![Data flow diagramme](./_images/data-flow.png)](./_images/data-flow.jpg) @@ -82,10 +82,10 @@ The satellite process then fires data change notifications, which triggers the [ ### Local writes -Application code in the local app writes directly to the SQLite database using the [create, update and delete APIs](../usage/data-access/writes.md) from the type-safe database client. Before applying the writes, the client runs client-side validation to verify that the data is valid and will not be rejected once replicated. +Application code in the local app writes directly to the local SQLite or Postgres database using the [create, update and delete APIs](../usage/data-access/writes.md) from the type-safe database client. Before applying the writes, the client runs client-side validation to verify that the data is valid and will not be rejected once replicated. :::caution -Direct writes to SQLite that don't use the client library will also be replicated by the satellite process. However, this skips validation, so is dangerous and best avoided. +Direct writes to the local database that don't use the client library will also be replicated by the satellite process. However, this skips validation, so is dangerous and best avoided. ::: ElectricSQL aims to provide **finality** of local writes. That is to say: valid writes accepted locally should always be accepted by Electric and Postgres and never rejected unless invalid or unauthorised. This avoids having to code rollback handlers for local writes. This is key to simplifying local-first development. @@ -95,7 +95,7 @@ Whilst local writes are final, they are still subject to concurrent merge semant ### Streaming into Electric -When the SQLite database migrations are generated from the Postgres DDL changes, triggers are added that automatically copy insert, update and delete operations on the tables to the "oplog" table. The satellite process then processes these operations by sending them to the Electric server over the Satellite protocol. Electric then applies server-side validation and authorisation before sending on to Postgres over the incoming logical-replication stream. +When the local database migrations are generated from the Postgres DDL changes, triggers are added that automatically copy insert, update and delete operations on the tables to the "oplog" table. The satellite process then processes these operations by sending them to the Electric server over the Satellite protocol. Electric then applies server-side validation and authorisation before sending on to Postgres over the incoming logical-replication stream. :::note Electric acts as a [logical replication publisher](https://www.postgresql.org/docs/current/logical-replication.html). This is why you configure a `LOGICAL_PUBLISHER_HOST` when deploying the Electric sync service -- so that Postgres can connect to consume inbound logical replication. diff --git a/docs/top-level-listings/integrations.md b/docs/top-level-listings/integrations.md index 0a46f37f42..8477d441fc 100644 --- a/docs/top-level-listings/integrations.md +++ b/docs/top-level-listings/integrations.md @@ -7,7 +7,7 @@ import DocCardList from '@theme/DocCardList'; ElectricSQL is designed to work as a drop-in solution for existing applications and stacks. -It works with standard open-source Postgres and SQLite. In the frontend, you [adapt the standard SQLite driver](../integrations/drivers/index.md) for your target environment and bind live data to your existing [reactivity and component framework](../integrations/frontend/index.md). +It works with standard open-source Postgres and SQLite. In the frontend, you [adapt the standard SQLite, PGlite or Postgres driver](../integrations/drivers/index.md) for your target environment and bind live data to your existing [reactivity and component framework](../integrations/frontend/index.md). In the backend, you can use your existing [web framework and migrations tooling](../integrations/backend/index.md) to manage content and evolve the database schema and standard [event sourcing tools](../integrations/event-sourcing/index.md) to integrate server-side workflows and background processing. diff --git a/docs/top-level-listings/reference.md b/docs/top-level-listings/reference.md index 09f3cc2659..9b85a4f3d8 100644 --- a/docs/top-level-listings/reference.md +++ b/docs/top-level-listings/reference.md @@ -5,7 +5,7 @@ slug: /reference import DocCardList from '@theme/DocCardList'; -ElectricSQL is a conflict-free sync layer implementing active-active replication between Postgres in the cloud and SQLite on the local device. As such, it extends Postgres for [strong eventual consistency](../reference/consistency.md) and [optimal scale and resiliency](../reference/architecture.md). +ElectricSQL is a conflict-free sync layer implementing active-active replication between Postgres in the cloud and either SQLite or Postgres on the local device. As such, it extends Postgres for [strong eventual consistency](../reference/consistency.md) and [optimal scale and resiliency](../reference/architecture.md). ElectricSQL is developed by a team of [experienced engineers and specialist distributed database experts](/about/team), under the guidance of: diff --git a/docs/usage/data-access/client.md b/docs/usage/data-access/client.md index 0a3f334b0e..28c9723b2f 100644 --- a/docs/usage/data-access/client.md +++ b/docs/usage/data-access/client.md @@ -21,9 +21,9 @@ By default this outputs a `./src/generated/client` folder with an `index.ts` fil ## Instantiating the client -The exact code for instantiating your database client depends on the SQLite driver that you're using for your target environment. However, the steps are the same across drivers: +The exact code for instantiating your database client depends on the SQLite, PGlite or Postgres driver that you're using for your target environment. However, the steps are the same across drivers: -1. initialise an SQLite database connection (`conn`) using your underlying driver +1. initialise a database connection (`conn`) using your underlying driver 2. import your database schema (`schema`) from the `./generated/client` folder 3. optionally define a custom configuration `config` 4. pass these to your driver's `electrify` function to instantiate the client diff --git a/docs/usage/data-access/shapes.md b/docs/usage/data-access/shapes.md index de26c3559b..2fdfd3dadd 100644 --- a/docs/usage/data-access/shapes.md +++ b/docs/usage/data-access/shapes.md @@ -7,7 +7,7 @@ sidebar_position: 30 Shapes are the core primitive for controlling sync in the ElectricSQL system. -Local apps establish shape subscriptions. This syncs data from the cloud onto the local device using the [Satellite replication protocol](../../api/satellite.md), into the local embedded SQLite database. Once the initial data has synced, [queries](./queries.md) can run against it. +Local apps establish shape subscriptions. This syncs data from the cloud onto the local device using the [Satellite replication protocol](../../api/satellite.md), into the local embedded database. Once the initial data has synced, [queries](./queries.md) can run against it. The [Electric sync service](../installation/service.md) maintains shape subscriptions and streams any new data and data changes onto the local device. In this way, local devices can sync a sub-set of a larger database for interactive offline use. @@ -288,7 +288,7 @@ Shape-based sync is under active development, and we're aware of some issues wit ### Foreign key and query consistency -ElectricSQL maintains foreign key consistency both in the PostgreSQL central database, and in the SQLite database on the client. To achieve it, the server will automatically follow any many-to-one relation in the requested shape. For example, if there are projects each with an owner and related issues, requesting all projects will also ensure that users who are owners of those projects are available on the device too. However, related issues won't show up on the device unless explicitly requested. +ElectricSQL maintains foreign key consistency both in the PostgreSQL central database, and in the SQLite or Postgres database on the client. To achieve it, the server will automatically follow any many-to-one relation in the requested shape. For example, if there are projects each with an owner and related issues, requesting all projects will also ensure that users who are owners of those projects are available on the device too. However, related issues won't show up on the device unless explicitly requested. #### Updating shapes @@ -296,7 +296,7 @@ ElectricSQL maintains foreign key consistency both in the PostgreSQL central dat We're working to fix this limitation ::: -Once a subscription is established, it remains statefully in the local SQLite database even when you change the code. For example, doing `db.projects.sync({ where: { id: 1 }})`, starting the application, then changing the code to `db.projects.sync({ where: { id: 2 }})` will result in **2 subscriptions** established, with both projects synced to the device. We're working on lifting this limitation. +Once a subscription is established, it remains statefully in the local database even when you change the code. For example, doing `db.projects.sync({ where: { id: 1 }})`, starting the application, then changing the code to `db.projects.sync({ where: { id: 2 }})` will result in **2 subscriptions** established, with both projects synced to the device. We're working on lifting this limitation. #### Unsubscribe not available diff --git a/docs/usage/data-modelling/types.md b/docs/usage/data-modelling/types.md index 668c845bc7..d6f5a7ead2 100644 --- a/docs/usage/data-modelling/types.md +++ b/docs/usage/data-modelling/types.md @@ -5,9 +5,9 @@ description: >- sidebar_position: 40 --- -ElectricSQL syncs data between Postgres and SQLite. +ElectricSQL syncs data between Postgres on the server and either a SQLite or Postgres on the client. -To do this, we map between [Postgres data types](https://www.postgresql.org/docs/current/datatype.html) and [SQLite data types](https://www.sqlite.org/datatype3.html). In addition, we validate [local writes](../../reference/architecture.md#local-writes) to ensure that the values written into the local database will successfully replicate into Postgres. +In order to support SQLite on the client, we map between [Postgres data types](https://www.postgresql.org/docs/current/datatype.html) and [SQLite data types](https://www.sqlite.org/datatype3.html). In addition, we validate [local writes](../../reference/architecture.md#local-writes) to ensure that the values written into the local database will successfully replicate into Postgres. As a result, we support a limited set of validated Postgres data types. If you try to [electrify a table](./electrification.md) which contains unsupported types or [constraints](./constraints.md), this will fail. The same applies to altering an electrified table. @@ -61,7 +61,7 @@ In future we plan to support more fine grained merge strategies for JSON data. :::info BYTEA support ElectricSQL supports `bytea` data but not all SQLite drivers are capable of reading/writing blobs - see table below: -| [wa-sqlite](../../integrations/drivers/web/wa-sqlite.md) | [better-sqlite3](../../integrations/drivers/server/node.md) | [expo-sqlite](../../integrations/drivers/mobile/expo.md?usage=expo-sqlite) | [expo-sqlite/next](../../integrations/drivers/mobile/expo.md?usage=expo-sqlite-next)| [op-sqlite](../../integrations/drivers/mobile/react-native.md) | +| [wa-sqlite](../../integrations/drivers/web/wa-sqlite.md) | [better-sqlite3](../../integrations/drivers/server/better-sqlite3.md) | [expo-sqlite](../../integrations/drivers/mobile/expo.md?usage=expo-sqlite) | [expo-sqlite/next](../../integrations/drivers/mobile/expo.md?usage=expo-sqlite-next)| [op-sqlite](../../integrations/drivers/mobile/react-native.md) | |:---------:|:--------------:|:-----------:|:----------------:|:---------:| | ✅︎ | ✅︎ | ❌ | ✅︎ | ✅︎ | From b945f295be5b0ef62afd412d114d252d508e051c Mon Sep 17 00:00:00 2001 From: Sam Willis Date: Wed, 1 May 2024 21:17:59 +0100 Subject: [PATCH 2/6] Changes after review --- docs/integrations/drivers/server/pglite.md | 8 ++++---- docs/integrations/drivers/server/postgres.md | 2 +- docs/integrations/drivers/web/pglite.md | 2 +- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/docs/integrations/drivers/server/pglite.md b/docs/integrations/drivers/server/pglite.md index 9485ae78be..568f1b6691 100644 --- a/docs/integrations/drivers/server/pglite.md +++ b/docs/integrations/drivers/server/pglite.md @@ -2,7 +2,7 @@ title: PGlite --- -ElectricSQL supports [Node.js](https://nodejs.org) server application using using [PGlite](https://github.com/electric-sql/pglite/), our lightweight WebAssembly build of Postgres. +ElectricSQL supports [Node.js](https://nodejs.org) server application using [PGlite](https://github.com/electric-sql/pglite/), our lightweight WebAssembly build of Postgres. ## Dependencies @@ -29,14 +29,14 @@ const config = { } // Create the PGlite database connection. The first argument -// is your database name. Changing this will create/use a new -// local database file. +// is your Postgres `pgdata` directory. Changing this will +// create/use a new local database. const conn = new PGlite('/path/to/postgres/datadir') // Instantiate your electric client. const electric = await electrify(conn, schema, config) -// Connect to Electric, passing along your authentication token +// Connect to the sync service, passing along your authentication token // See Usage -> Authentication for more details. await electric.connect('your token') ``` diff --git a/docs/integrations/drivers/server/postgres.md b/docs/integrations/drivers/server/postgres.md index 272d20a4d9..37f145063c 100644 --- a/docs/integrations/drivers/server/postgres.md +++ b/docs/integrations/drivers/server/postgres.md @@ -37,7 +37,7 @@ await client.connect() const conn = ElectricDatabase(client, 'name-of-database') const electric = await electrify(conn, schema, config) -// Connect to Electric, passing along your authentication token +// Connect to the sync service, passing along your authentication token // See Usage -> Authentication for more details. await electric.connect('your token') ``` diff --git a/docs/integrations/drivers/web/pglite.md b/docs/integrations/drivers/web/pglite.md index 9667031409..a79b2941c2 100644 --- a/docs/integrations/drivers/web/pglite.md +++ b/docs/integrations/drivers/web/pglite.md @@ -44,7 +44,7 @@ const conn = new PGlite('idb://electric.db', { // Instantiate your electric client. const electric = await electrify(conn, schema, config) -// Connect to Electric, passing along your authentication token +// Connect to the sync service, passing along your authentication token // See Usage -> Authentication for more details. await electric.connect('your token') ``` From 57daa600c2f43401f16e26f9739c93c51a437c7a Mon Sep 17 00:00:00 2001 From: Sam Willis Date: Thu, 2 May 2024 11:25:00 +0100 Subject: [PATCH 3/6] Update postgres drever docs to remove the ElectricDatabase wrapper --- docs/integrations/drivers/server/postgres.md | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/docs/integrations/drivers/server/postgres.md b/docs/integrations/drivers/server/postgres.md index 37f145063c..267c4bf3ef 100644 --- a/docs/integrations/drivers/server/postgres.md +++ b/docs/integrations/drivers/server/postgres.md @@ -16,7 +16,7 @@ npm install pg ```tsx import pg from 'pg' -import { electrify, ElectricDatabase } from 'electric-sql/node-postgres' +import { electrify } from 'electric-sql/node-postgres' // Import your generated database schema. import { schema } from './generated/client' @@ -27,14 +27,13 @@ const config = { } // Create the node-postgres database connection. -const client = new pg.Client({ +const conn = new pg.Client({ // Connection configuration, see: // https://node-postgres.com/apis/client }) -await client.connect() +await conn.connect() // Instantiate your electric client. -const conn = ElectricDatabase(client, 'name-of-database') const electric = await electrify(conn, schema, config) // Connect to the sync service, passing along your authentication token From 7d71105529d2935bb45854d8d9957615b7261c94 Mon Sep 17 00:00:00 2001 From: Sam Willis Date: Thu, 2 May 2024 11:33:57 +0100 Subject: [PATCH 4/6] Use "local database" rather than refernece SQLite or Postgres --- docs/api/clients/typescript.md | 2 +- docs/integrations/drivers/_category_.yml | 2 +- docs/integrations/drivers/index.md | 2 +- docs/integrations/drivers/mobile/_category_.yml | 2 +- docs/integrations/drivers/other/_category_.yml | 2 +- docs/integrations/drivers/other/generic.md | 2 +- docs/integrations/drivers/server/_category_.yml | 2 +- docs/integrations/drivers/web/_category_.yml | 2 +- docs/quickstart/index.md | 2 +- docs/recipes/01-read-only/data-viewer.md | 2 +- docs/reference/architecture.md | 8 ++++---- docs/usage/data-access/client.md | 2 +- docs/usage/data-access/shapes.md | 2 +- 13 files changed, 16 insertions(+), 16 deletions(-) diff --git a/docs/api/clients/typescript.md b/docs/api/clients/typescript.md index 20508c399b..3b8312d3fe 100644 --- a/docs/api/clients/typescript.md +++ b/docs/api/clients/typescript.md @@ -18,7 +18,7 @@ The Typescript client provides a number of functions for developing front-end ap A Typescript client comprises of: -1. A SQLite, PGlite or Postgres database connection from a [supported driver](../../integrations/drivers/) +1. A local database connection from a [supported driver](../../integrations/drivers/) 2. A client schema [generated using the generator command](../cli.md#generate) 3. A [configuration object](#configuration) diff --git a/docs/integrations/drivers/_category_.yml b/docs/integrations/drivers/_category_.yml index 509c8703d3..681628e3b0 100644 --- a/docs/integrations/drivers/_category_.yml +++ b/docs/integrations/drivers/_category_.yml @@ -1,6 +1,6 @@ customProps: description: >- - Adapt the SQLite or Postgres database driver for your target environment. + Adapt the local database driver for your target environment. hide_overview: true icon: /img/icons/nodejs.png link: diff --git a/docs/integrations/drivers/index.md b/docs/integrations/drivers/index.md index e6e85c8fc3..c818d1d852 100644 --- a/docs/integrations/drivers/index.md +++ b/docs/integrations/drivers/index.md @@ -5,7 +5,7 @@ sidebar_position: 10 import DocCardList from '@theme/DocCardList'; -Adapt the local SQLite, PGlite or Postgres database driver for your target environment. +Adapt the local database driver for your target environment. ## How drivers work diff --git a/docs/integrations/drivers/mobile/_category_.yml b/docs/integrations/drivers/mobile/_category_.yml index 470b3dbaea..651e12522a 100644 --- a/docs/integrations/drivers/mobile/_category_.yml +++ b/docs/integrations/drivers/mobile/_category_.yml @@ -1,7 +1,7 @@ label: Mobile customProps: description: >- - SQLite driver adapters for mobile apps. + Database driver adapters for mobile apps. hide_overview: true icon: /img/icons/android.svg position: 20 diff --git a/docs/integrations/drivers/other/_category_.yml b/docs/integrations/drivers/other/_category_.yml index 95c4366a97..cac3628a3a 100644 --- a/docs/integrations/drivers/other/_category_.yml +++ b/docs/integrations/drivers/other/_category_.yml @@ -1,7 +1,7 @@ label: Other customProps: description: >- - Create your own SQLite or Postgres driver adapter. + Create your own database driver adapter. hide_overview: true icon: /img/icons/other.svg position: 40 diff --git a/docs/integrations/drivers/other/generic.md b/docs/integrations/drivers/other/generic.md index 5b122aa4d0..f28ddee1c3 100644 --- a/docs/integrations/drivers/other/generic.md +++ b/docs/integrations/drivers/other/generic.md @@ -5,7 +5,7 @@ description: >- sidebar_position: 10 --- -You can integrate any SQLite database driver by adapting it to the ElectricSQL [`DatabaseAdapter` interface](https://github.com/electric-sql/electric/blob/main/clients/typescript/src/electric/adapter.ts): +You can integrate any SQLite or Postgres database driver by adapting it to the ElectricSQL [`DatabaseAdapter` interface](https://github.com/electric-sql/electric/blob/main/clients/typescript/src/electric/adapter.ts): ```tsx export interface DatabaseAdapter { diff --git a/docs/integrations/drivers/server/_category_.yml b/docs/integrations/drivers/server/_category_.yml index caeba16da9..66011fce7c 100644 --- a/docs/integrations/drivers/server/_category_.yml +++ b/docs/integrations/drivers/server/_category_.yml @@ -1,7 +1,7 @@ label: Server customProps: description: >- - SQLite and Postgres driver adapters for NodeJS on the server. + Database driver adapters for NodeJS on the server. hide_overview: true icon: /img/icons/nodejs.png position: 30 diff --git a/docs/integrations/drivers/web/_category_.yml b/docs/integrations/drivers/web/_category_.yml index 54ba9f6ef3..6bff21ec67 100644 --- a/docs/integrations/drivers/web/_category_.yml +++ b/docs/integrations/drivers/web/_category_.yml @@ -1,7 +1,7 @@ label: Web customProps: description: >- - SQLite and Postgres driver adapters for the web. + Database driver adapters for the web. hide_overview: true icon: /img/icons/firefox.svg position: 10 diff --git a/docs/quickstart/index.md b/docs/quickstart/index.md index 9312e925b8..5b1b82736d 100644 --- a/docs/quickstart/index.md +++ b/docs/quickstart/index.md @@ -76,7 +76,7 @@ ELECTRIC GRANT ALL ### Instantiate -Wrap your local [SQLite or Postgres driver](../integrations/drivers/index.md) with a type-safe, schema-aware [database Client](../usage/data-access/client.md): +Wrap your local [database driver](../integrations/drivers/index.md) with a type-safe, schema-aware [database Client](../usage/data-access/client.md): ```tsx import { electrify, ElectricDatabase } from 'electric-sql/wa-sqlite' diff --git a/docs/recipes/01-read-only/data-viewer.md b/docs/recipes/01-read-only/data-viewer.md index ca86e8c0a6..aac4bf5f35 100644 --- a/docs/recipes/01-read-only/data-viewer.md +++ b/docs/recipes/01-read-only/data-viewer.md @@ -27,7 +27,7 @@ In data-driven applications, providing users with intuitive tools to explore and With ElectricSQL, the [local-first development](/docs/intro/local-first) approach uses a local database for efficient querying, sorting, and filtering of data, enabling users to quickly and interactively explore datasets with ease, without worrying about network connectivity. By leveraging the power of SQL queries, developers can perform complex data manipulations and retrieve specific subsets of data based on user-defined criteria, ensuring a tailored and responsive viewing experience. -This recipe demonstrates how to use ElectricSQL to create a table and chart data viewer for a simple e-commerce-like orders database, delegating pagination, sorting, filtering, aggregation, and arbitrary queries to the underlying SQLite database. +This recipe demonstrates how to use ElectricSQL to create a table and chart data viewer for a simple e-commerce-like orders database, delegating pagination, sorting, filtering, aggregation, and arbitrary queries to the underlying database database. diff --git a/docs/reference/architecture.md b/docs/reference/architecture.md index d096f5a879..20475a70f4 100644 --- a/docs/reference/architecture.md +++ b/docs/reference/architecture.md @@ -20,7 +20,7 @@ ElectricSQL has three primary components. [Postgres](../usage/installation/postg [![High level component diagramme](./_images/high-level-components.png)](./_images/high-level-components.jpg) -Inside the Client there is a [generated](../api/cli.md#generate) type-safe [data access library](../usage/data-access/client.md). A [satellite replication process](https://github.com/electric-sql/electric/blob/main/clients/typescript/src/satellite/process.ts) (per named local database), SQLite or Postgres [driver adapters](../integrations/drivers/index.md) and a [reactivity system](#reactivity) with [front-end framework integrations](../integrations/frontend/index.md). +Inside the Client there is a [generated](../api/cli.md#generate) type-safe [data access library](../usage/data-access/client.md). A [satellite replication process](https://github.com/electric-sql/electric/blob/main/clients/typescript/src/satellite/process.ts) (per named local database), local database [driver adapters](../integrations/drivers/index.md) and a [reactivity system](#reactivity) with [front-end framework integrations](../integrations/frontend/index.md). ### Topology @@ -31,7 +31,7 @@ Usually there is one central Postgres, which can have many Electrics in front of ## Schema evolution -ElectricSQL is a relational system based on Postgres that syncs between Postgres and SQLite. Postgres and SQLite share a database schema. This schema is based on an exposed (["electrified"](../usage/data-modelling/electrification.md)) subset of the Postgres DDL schema. Electric streams changes to the schema into connected client applications over the satellite protocol. +ElectricSQL is a relational system based on Postgres that syncs between Postgres and a local database. Postgres and the local database share a database schema. This schema is based on an exposed (["electrified"](../usage/data-modelling/electrification.md)) subset of the Postgres DDL schema. Electric streams changes to the schema into connected client applications over the satellite protocol. [![Schema evolution diagramme](./_images/schema-evolution.png)](./_images/schema-evolution.jpg) @@ -44,7 +44,7 @@ The Postgres schema is managed using any [standard migration tooling](../usage/d Electric provides an HTTP "status API" to access the electrified DDL schema. In development, the [generator command](../api/cli.md#generate) calls this API to pull down the schema and uses it to: 1. generate a type-safe data access library -2. write an array of SQLite-compatible migrations into an importable Javascript file +2. write an array of local database compatible migrations into an importable Javascript file This library and the migrations are imported into the local app. When the app [instantiates the electric database client](../usage/data-access/client.md) the system ensures that the local database is up-to-date with the bundled migrations. @@ -82,7 +82,7 @@ The satellite process then fires data change notifications, which triggers the [ ### Local writes -Application code in the local app writes directly to the local SQLite or Postgres database using the [create, update and delete APIs](../usage/data-access/writes.md) from the type-safe database client. Before applying the writes, the client runs client-side validation to verify that the data is valid and will not be rejected once replicated. +Application code in the local app writes directly to the local database using the [create, update and delete APIs](../usage/data-access/writes.md) from the type-safe database client. Before applying the writes, the client runs client-side validation to verify that the data is valid and will not be rejected once replicated. :::caution Direct writes to the local database that don't use the client library will also be replicated by the satellite process. However, this skips validation, so is dangerous and best avoided. diff --git a/docs/usage/data-access/client.md b/docs/usage/data-access/client.md index 28c9723b2f..3660bc171a 100644 --- a/docs/usage/data-access/client.md +++ b/docs/usage/data-access/client.md @@ -21,7 +21,7 @@ By default this outputs a `./src/generated/client` folder with an `index.ts` fil ## Instantiating the client -The exact code for instantiating your database client depends on the SQLite, PGlite or Postgres driver that you're using for your target environment. However, the steps are the same across drivers: +The exact code for instantiating your database client depends on the local database driver that you're using for your target environment. However, the steps are the same across drivers: 1. initialise a database connection (`conn`) using your underlying driver 2. import your database schema (`schema`) from the `./generated/client` folder diff --git a/docs/usage/data-access/shapes.md b/docs/usage/data-access/shapes.md index 2fdfd3dadd..251ff472c6 100644 --- a/docs/usage/data-access/shapes.md +++ b/docs/usage/data-access/shapes.md @@ -288,7 +288,7 @@ Shape-based sync is under active development, and we're aware of some issues wit ### Foreign key and query consistency -ElectricSQL maintains foreign key consistency both in the PostgreSQL central database, and in the SQLite or Postgres database on the client. To achieve it, the server will automatically follow any many-to-one relation in the requested shape. For example, if there are projects each with an owner and related issues, requesting all projects will also ensure that users who are owners of those projects are available on the device too. However, related issues won't show up on the device unless explicitly requested. +ElectricSQL maintains foreign key consistency both in the PostgreSQL central database, and in the local database on the client. To achieve it, the server will automatically follow any many-to-one relation in the requested shape. For example, if there are projects each with an owner and related issues, requesting all projects will also ensure that users who are owners of those projects are available on the device too. However, related issues won't show up on the device unless explicitly requested. #### Updating shapes From 77e74ee9c01596cad4ca295c0548ede35e4cd1fa Mon Sep 17 00:00:00 2001 From: Sam Willis Date: Thu, 2 May 2024 18:28:25 +0100 Subject: [PATCH 5/6] tweaks --- docs/api/clients/typescript.md | 2 +- docs/integrations/drivers/server/pglite.md | 5 ++++- docs/integrations/drivers/server/postgres.md | 7 +++++-- docs/integrations/drivers/web/pglite.md | 3 +++ docs/recipes/01-read-only/data-viewer.md | 2 +- docs/top-level-listings/integrations.md | 2 +- docs/usage/data-modelling/types.md | 2 +- 7 files changed, 16 insertions(+), 7 deletions(-) diff --git a/docs/api/clients/typescript.md b/docs/api/clients/typescript.md index 3b8312d3fe..61c0541e2e 100644 --- a/docs/api/clients/typescript.md +++ b/docs/api/clients/typescript.md @@ -10,7 +10,7 @@ sidebar_position: 10 The Typescript client provides a number of functions for developing front-end applications with Electric: - [Authenticating](../../usage/auth/) with the sync service -- [Synchronising database](#shapes) to a local SQLite, PGlite or Postgres database +- [Synchronising database](#shapes) to a local embedded database - [Type-safe data access](#queries) to read and update the database - [Reactive live queries](#live-queries) that update in realtime as the database changes diff --git a/docs/integrations/drivers/server/pglite.md b/docs/integrations/drivers/server/pglite.md index 568f1b6691..e4221ccdb1 100644 --- a/docs/integrations/drivers/server/pglite.md +++ b/docs/integrations/drivers/server/pglite.md @@ -2,7 +2,7 @@ title: PGlite --- -ElectricSQL supports [Node.js](https://nodejs.org) server application using [PGlite](https://github.com/electric-sql/pglite/), our lightweight WebAssembly build of Postgres. +ElectricSQL supports [Node.js](https://nodejs.org) server applications using [PGlite](https://github.com/electric-sql/pglite/), our lightweight WebAssembly build of Postgres. ## Dependencies @@ -17,7 +17,10 @@ See the [PGlite repo](https://github.com/electric-sql/pglite/) for more informat ## Usage ```tsx +// Import the PGlite database client. import { electrify } from 'electric-sql/pglite' + +// Import the adapter to electrify PGlite from the ElectricSQL library. import { PGlite } from '@electric-sql/pglite' // Import your generated database schema. diff --git a/docs/integrations/drivers/server/postgres.md b/docs/integrations/drivers/server/postgres.md index 267c4bf3ef..8e349e0866 100644 --- a/docs/integrations/drivers/server/postgres.md +++ b/docs/integrations/drivers/server/postgres.md @@ -2,7 +2,7 @@ title: node-postgres --- -ElectricSQL supports [Node.js](https://nodejs.org) server application using the [node-postgres](https://node-postgres.com) driver. +ElectricSQL supports [Node.js](https://nodejs.org) server applications using the [node-postgres](https://node-postgres.com) driver. ## Dependencies @@ -15,8 +15,11 @@ npm install pg ## Usage ```tsx +// Import the node-postgres database client. import pg from 'pg' -import { electrify } from 'electric-sql/node-postgres' + +// Import the adapter to electrify node-postgres from the ElectricSQL library. +import { PGlite } from '@electric-sql/node-postgres' // Import your generated database schema. import { schema } from './generated/client' diff --git a/docs/integrations/drivers/web/pglite.md b/docs/integrations/drivers/web/pglite.md index a79b2941c2..c25a58b592 100644 --- a/docs/integrations/drivers/web/pglite.md +++ b/docs/integrations/drivers/web/pglite.md @@ -17,7 +17,10 @@ See the [PGlite repo](https://github.com/electric-sql/pglite/) for more informat ## Usage ```tsx +// Import the PGlite database client. import { electrify } from 'electric-sql/pglite' + +// Import the adapter to electrify PGlite from the ElectricSQL library. import { PGlite } from '@electric-sql/pglite' // Import your generated database schema. diff --git a/docs/recipes/01-read-only/data-viewer.md b/docs/recipes/01-read-only/data-viewer.md index aac4bf5f35..5505a9c7e8 100644 --- a/docs/recipes/01-read-only/data-viewer.md +++ b/docs/recipes/01-read-only/data-viewer.md @@ -27,7 +27,7 @@ In data-driven applications, providing users with intuitive tools to explore and With ElectricSQL, the [local-first development](/docs/intro/local-first) approach uses a local database for efficient querying, sorting, and filtering of data, enabling users to quickly and interactively explore datasets with ease, without worrying about network connectivity. By leveraging the power of SQL queries, developers can perform complex data manipulations and retrieve specific subsets of data based on user-defined criteria, ensuring a tailored and responsive viewing experience. -This recipe demonstrates how to use ElectricSQL to create a table and chart data viewer for a simple e-commerce-like orders database, delegating pagination, sorting, filtering, aggregation, and arbitrary queries to the underlying database database. +This recipe demonstrates how to use ElectricSQL to create a table and chart data viewer for a simple e-commerce-like orders database, delegating pagination, sorting, filtering, aggregation, and arbitrary queries to the underlying local database. diff --git a/docs/top-level-listings/integrations.md b/docs/top-level-listings/integrations.md index 8477d441fc..3ac212e546 100644 --- a/docs/top-level-listings/integrations.md +++ b/docs/top-level-listings/integrations.md @@ -7,7 +7,7 @@ import DocCardList from '@theme/DocCardList'; ElectricSQL is designed to work as a drop-in solution for existing applications and stacks. -It works with standard open-source Postgres and SQLite. In the frontend, you [adapt the standard SQLite, PGlite or Postgres driver](../integrations/drivers/index.md) for your target environment and bind live data to your existing [reactivity and component framework](../integrations/frontend/index.md). +It works with standard open-source Postgres and SQLite. In the frontend, you [adapt the standard database driver](../integrations/drivers/index.md) for your target environment and bind live data to your existing [reactivity and component framework](../integrations/frontend/index.md). In the backend, you can use your existing [web framework and migrations tooling](../integrations/backend/index.md) to manage content and evolve the database schema and standard [event sourcing tools](../integrations/event-sourcing/index.md) to integrate server-side workflows and background processing. diff --git a/docs/usage/data-modelling/types.md b/docs/usage/data-modelling/types.md index d6f5a7ead2..33cc4cfeb6 100644 --- a/docs/usage/data-modelling/types.md +++ b/docs/usage/data-modelling/types.md @@ -5,7 +5,7 @@ description: >- sidebar_position: 40 --- -ElectricSQL syncs data between Postgres on the server and either a SQLite or Postgres on the client. +ElectricSQL syncs data between Postgres on the server and either SQLite or Postgres on the client. In order to support SQLite on the client, we map between [Postgres data types](https://www.postgresql.org/docs/current/datatype.html) and [SQLite data types](https://www.sqlite.org/datatype3.html). In addition, we validate [local writes](../../reference/architecture.md#local-writes) to ensure that the values written into the local database will successfully replicate into Postgres. From 6f43ee1e0910c620221bc53bc0af5c1bf36d79b9 Mon Sep 17 00:00:00 2001 From: Sam Willis Date: Mon, 13 May 2024 09:39:36 +0100 Subject: [PATCH 6/6] Update examples to link to PGlite versions --- docs/examples/basic.md | 12 +++++++++--- docs/examples/linear-lite.md | 2 +- 2 files changed, 10 insertions(+), 4 deletions(-) diff --git a/docs/examples/basic.md b/docs/examples/basic.md index 788f16edcb..02a2669b1c 100644 --- a/docs/examples/basic.md +++ b/docs/examples/basic.md @@ -9,7 +9,7 @@ import BrowserOnly from '@docusaurus/BrowserOnly' # Basic example -See the basic web example running online at [basic-items.electric-sql.com](https://basic-items.electric-sql.com): +See the basic web example running online using the SQLite driver at [basic-items.electric-sql.com](https://basic-items.electric-sql.com) and using PGlite at [basic-items-pg.electric-sql.com/](https://basic-items-pg.electric-sql.com/).
@@ -17,7 +17,7 @@ See the basic web example running online at [basic-items.electric-sql.com](https
-It's a basic app running in the web browser [using wa-sqlite](../integrations/drivers/web/wa-sqlite.md). You can also open in your mobile browser by scanning this QR code: +It's a basic app running in the web browser [using wa-sqlite](../integrations/drivers/web/wa-sqlite.md) or [PGlite](../integrations/drivers/web/pglite.md). You can also open in your mobile browser by scanning this QR code:
@@ -57,10 +57,16 @@ Clone the monorepo: git clone https://github.com/electric-sql/electric ``` -Change into the `web-wa-sqlite` example directory: +Change into the `web-wa-sqlite` example directory for the wa-sqlite version: ```shell cd electric/examples/web-wa-sqlite ``` Follow the instructions in the [README.md](https://github.com/electric-sql/electric/blob/main/examples/web-wa-sqlite/README.md) and see the page here on [running the examples](./notes/running). + +Alternatively the `web-pglite` example directory contains the PGlite version: + +```shell +cd electric/examples/web-pglite +``` diff --git a/docs/examples/linear-lite.md b/docs/examples/linear-lite.md index d59ed7f126..305d38cd6f 100644 --- a/docs/examples/linear-lite.md +++ b/docs/examples/linear-lite.md @@ -9,7 +9,7 @@ import BrowserOnly from '@docusaurus/BrowserOnly' # LinearLite example -This LinearLite example is a simplified clone of [Linear](https://linear.app) developed using ElectricSQL. You can open it online at [linear-lite.electric-sql.com](https://linear-lite.electric-sql.com): +This LinearLite example is a simplified clone of [Linear](https://linear.app) developed using ElectricSQL. We have two versions available online, one using [wa-sqlite](../integrations/drivers/web/wa-sqlite.md) at [linear-lite.electric-sql.com](https://linear-lite.electric-sql.com) and another using [PGlite](../integrations/drivers/web/pglite.md) at [linear-lite-pg.electric-sql.com](https://linear-lite-pg.electric-sql.com/):