diff --git a/README.md b/README.md index ebc3a55d..2282284e 100644 --- a/README.md +++ b/README.md @@ -15,8 +15,8 @@

- Local-first software platform for developing web and mobile apps with instant reactivity, realtime multi-user collaboration and conflict-free offline. From the inventors of CRDTs. Based on standard open source Postgres and SQLite. -

+ Local-first sync layer for web and mobile apps. Build reactive, realtime, local-first apps directly on Postgres. +

@@ -37,27 +37,30 @@

-# Quick links +# ElectricSQL + +Sync for modern apps. From the inventors of CRDTs. + +## Quick links +- [Website](https://electric-sql.com) - [Documentation](https://electric-sql.com/docs) -- [Technical intro](https://electric-sql.com/docs/overview/technical-intro) -- [Quickstart](https://electric-sql.com/docs/usage/quickstart) -- [Examples](https://github.com/electric-sql/examples) -- [FAQs](https://electric-sql.com/docs/overview/faqs) +- [Introduction](https://electric-sql.com/docs/intro/local-first) +- [Quickstart](https://electric-sql.com/docs/quickstart) -# What is ElectricSQL? +## What is ElectricSQL? ElectricSQL is a local-first software platform that makes it easy to develop high-quality, modern apps with instant reactivity, realtime multi-user collaboration and conflict-free offline support. [Local-first](https://www.inkandswitch.com/local-first/) is a new development paradigm where your app code talks directly to an embedded local database and data syncs in the background via active-active database replication. Because the app code talks directly to a local database, apps feel instant. Because data syncs in the background via active-active replication it naturally supports multi-user collaboration and conflict-free offline. -# How do I use it? +## How do I use it? ElectricSQL gives you instant local-first for your Postgres. Think of it like "Hasura for local-first". Drop ElectricSQL onto an existing Postgres-based system and you get instant local-first data synced into your apps. -ElectricSQL then provides a whole developer experience for you to control what data syncs where and to work with it locally in your app code. See the [Documentation](https://electric-sql.com/docs) and the [Quickstart guide](https://electric-sql.com/docs/usage/quickstart) to get started. +ElectricSQL then provides a whole developer experience for you to control what data syncs where and to work with it locally in your app code. See the [Introduction](https://electric-sql.com/docs/intro-local-first) and the [Quickstart guide](https://electric-sql.com/docs/quickstart) to get started. -# Repo structure +## Repo structure This is the main repository for the ElectricSQL source code. Key components include: @@ -69,21 +72,21 @@ This is the main repository for the ElectricSQL source code. Key components incl See the Makefiles for test and build instructions and the [e2e](https://github.com/electric-sql/electric/tree/main/e2e) folder for integration tests. -# Team +## Team ElectricSQL was founded by [@thruflo](https://github.com/thruflo) and [@balegas](https://github.com/balegas), under the guidance of: -- [Marc Shapiro](https://lip6.fr/Marc.Shapiro) and [Nuno Preguiça](https://asc.di.fct.unl.pt/~nmp), the co-inventors of CRDTs +- [Marc Shapiro](https://lip6.fr/Marc.Shapiro) and [Nuno Preguiça](https://asc.di.fct.unl.pt/~nmp), two of the co-inventors of CRDTs - [@bieniusa](https://linkedin.com/in/annette-bieniusa-b0807b145), the lead developer of [AntidoteDB](https://www.antidotedb.eu) - [@josevalim](https://www.linkedin.com/in/josevalim), the creator of the [Elixir](https://elixir-lang.org) programming language See the [Team](https://electric-sql.com/about/team) and [Literature](https://electric-sql.com/docs/reference/literature) pages for more details. -# Contributing +## Contributing See the [Community Guidelines](https://github.com/electric-sql/electric/blob/main/CODE_OF_CONDUCT.md) including the [Guide to Contributing](https://github.com/electric-sql/electric/blob/main/CONTRIBUTING.md) and [Contributor License Agreement](https://github.com/electric-sql/electric/blob/main/CLA.md). -# Support +## Support We have an [open community Discord](https://discord.electric-sql.com). Come and say hello and let us know if you have any questions or need any help getting things running. diff --git a/clients/typescript/README.md b/clients/typescript/README.md index a7a2dffe..df9ea6fb 100644 --- a/clients/typescript/README.md +++ b/clients/typescript/README.md @@ -16,14 +16,17 @@ # ElectricSQL Typescript Client -[ElectricSQL](https://electric-sql.com) is a local-first SQL system. It provides active-active cloud sync for embedded SQLite databases and a reactive programming model to bind components to live database queries. +[ElectricSQL](https://electric-sql.com) is a local-first sync layer for modern apps. Use it to build reactive, realtime, local-first apps using standard open source Postgres and SQLite. -The ElectricSQL Typescript Client is the main ElectricSQL client library for developing node, web and JavaScript-based mobile applications. It's designed to work with _any_ SQLite driver or bindings, with convienience functions to integrate with the most popular ones, including the primary drivers for [Expo](https://electric-sql.com/docs/usage/drivers#expo), [React Native](https://electric-sql.com/docs/usage/drivers#react-native), [SQL.js](https://electric-sql.com/docs/usage/drivers#web) and [Node.js](https://electric-sql.com/docs/usage/drivers#edge). +The ElectricSQL Typescript Client is the main ElectricSQL client library. It provides a type-safe database client autogenerated from your database schema and APIs for [Shape-based sync](https://electric-sql.com/docs/usage/data-access/shapes) and [live queries](https://electric-sql.com/docs/usage/data-access/queries) as well as SQLite driver adapters and frontend framework integrations. See the: - [Documentation](https://electric-sql.com/docs) -- [Quickstart](https://electric-sql.com/docs/usage/quickstart) +- [Introduction](https://electric-sql.com/docs/intro/local-first) +- [Quickstart](https://electric-sql.com/docs/quickstart) + +And see the [Drivers documentation](https://electric-sql.com/docs/integrations/drivers) for information on how to use for web, mobile, and server applications including wa-sqlite, React Native, Expo and NodeJS. ## Install @@ -41,100 +44,7 @@ npm install --save electric-sql ## Usage -Instantiate and use your SQLite driver as normal and call `electrify` when opening a new database connection. For example using `react-native-sqlite-storage`: - -```ts -import { electrify } from 'electric-sql/react-native' - -// Import your SQLite driver -import SQLite from 'react-native-sqlite-storage' -SQLite.enablePromise(true) - -// Import your app config and migrations -import config from '.electric/@config' - -// Open an SQLite database connection -const original = await SQLite.openDatabase('example.db') - -// ⚡ Electrify it -const db = electrify(original, config) - -// Use as normal, e.g.: -db.transaction((tx) => tx.executeSql('SELECT 1')) -``` - -### Using in the web browser - -Electric uses [SQL.js](https://electric-sql.com/docs/usage/drivers#web) in the browser with [absurd-sql](https://electric-sql.com/docs/usage/drivers#web) for persistence. This runs in a web worker (which we also use to keep background replication off the main thread). As a result, the electrified db client provides an asynchronous version of a subset of the SQL.js driver interface. - -First create a `worker.js` file that imports and starts an `ElectricWorker` process: - -```ts -import { ElectricWorker } from 'electric-sql/browser' - -ElectricWorker.start(self) -``` - -Then, in your main application: - -```ts -import { initElectricSqlJs } from 'electric-sql/browser' - -// Import your app config and migrations -import config from '.electric/@config' - -// Start the background worker -const url = new URL('./worker.js', import.meta.url) -const worker = new Worker(url, { type: 'module' }) - -// Electrify the SQL.js / absurd-sql machinery -const SQL = await initElectricSqlJs(worker, { - locateFile: (file) => `/${file}`, -}) - -// Open a named database connection -const db = await SQL.openDatabase('example.db', config) -``` - -This gives you persistent, local-first SQL with active-active replication -in your web browser 🤯. Use the db client as normal, with the proviso that -the methods are now async (they return promises rather than direct values). - -See the [Quickstart](https://electric-sql.com/docs/usage/quickstart) guide for more information. - -### Reactivity - -Once electrified, you can bind live database queries to your reactive components, so they automatically update when data changes or comes in over the replication stream. For example: - -```tsx -import React from 'react' -import { Pressable, Text, View } from 'react-native' - -import { useElectric, useElectricQuery } from 'electric-sql/react' - -export const LiveComponent = () => { - const db = useElectric() - const { results } = useElectricQuery('SELECT value FROM items') - - const addItem = () => { - sql.execute('INSERT INTO items VALUES(?)', [crypto.randomUUID()]) - } - - return ( - - {results.map((item, index) => ( - Item: {item.value} - ))} - - - Add - - - ) -} -``` - -See the [Reactivity](https://electric-sql.com/docs/usage/reactivity) guide for more information. +See the [Quickstart](https://electric-sql.com/docs/quickstart) and the [Usage guide](https://electric-sql.com/docs/usage). ## Issues diff --git a/components/electric/README.md b/components/electric/README.md index 0b1d33bd..3560452a 100644 --- a/components/electric/README.md +++ b/components/electric/README.md @@ -19,28 +19,17 @@ # ElectricSQL -Local-first. Electrified. - -You develop local-first apps. We provide the cloud sync. Without changing your database or your code. +Sync for modern apps. From the inventors of CRDTs. ## What is ElectricSQL? -ElectricSQL is a local-first SQL system that adds active-active replication and reactive queries to SQLite and Postgres. Use it to make local-first apps that feel instant, work offline and sync via the cloud. +ElectricSQL is a local-first sync layer for web and mobile apps. Use it to build reactive, realtime, local-first apps directly on Postgres. ## Getting started -- [Quickstart](https://electric-sql.com/docs/usage/quickstart) -- [Examples](https://github.com/electric-sql/examples) - [Documentation](https://electric-sql.com/docs) - -## Repo structure - -This repo contains the core backend services that proovide ElectricSQL's cloud sync. It's an Elixir application that integrates with Postgres over logical replication and SQLite via a Protobuf web socket protocol. - -See also: - -- [electric-sql/typescript-client](https://github.com/electric-sql/typescript-client) Typescript client library for local-first application development -- [electric-sql/cli](https://github.com/electric-sql/cli) command line interface (CLI) tool to manage config and migrations +- [Introduction](https://electric-sql.com/docs/intro/local-first) +- [Quickstart](https://electric-sql.com/docs/quickstart) ## Pre-reqs @@ -80,8 +69,6 @@ For example to write some data into one of the Postgres instances: docker exec -it -e PGPASSWORD=password electric_db_a_1 psql -h 127.0.0.1 -U electric -d electric ``` -There's a second instance, `electric-db_b_1`, if you want to see data being replicated between them. - Note that you can tear down all the containers with: ```sh diff --git a/examples/introduction/public/favicon.ico b/examples/introduction/public/favicon.ico index 63561c5c..e55095b9 100644 Binary files a/examples/introduction/public/favicon.ico and b/examples/introduction/public/favicon.ico differ diff --git a/examples/starter/template/public/favicon.ico b/examples/starter/template/public/favicon.ico index 63561c5c..e55095b9 100644 Binary files a/examples/starter/template/public/favicon.ico and b/examples/starter/template/public/favicon.ico differ diff --git a/examples/starter/template/src/logo.svg b/examples/starter/template/src/logo.svg index 5981412e..f5ec440a 100644 --- a/examples/starter/template/src/logo.svg +++ b/examples/starter/template/src/logo.svg @@ -1,16 +1,11 @@ - - - ElectricSQL Icon (Alt) - - - - - - - - - + + + diff --git a/examples/web-wa-sqlite/README.md b/examples/web-wa-sqlite/README.md index 31e8b82b..c18bef86 100644 --- a/examples/web-wa-sqlite/README.md +++ b/examples/web-wa-sqlite/README.md @@ -37,7 +37,7 @@ You can start the backend services for this example using docker: yarn backend:start ``` -If you're looking into running the services yourself, check the instructions in [running the examples](https://electric-sql.com/docs/examples/notes/running#running-your-own-postgres) page, which has information on how to connect Electric sync service to an existing Postgres database. +If you're looking into running the services yourself, check the instructions in [running the examples](https://electric-sql.com/docs/examples/notes/running#running-your-own-postgres) page, which has information on how to connect the Electric sync service to an existing Postgres database. > In that case, make sure you set the `DATABASE_URL` environment variable before running the following commands. diff --git a/examples/web-wa-sqlite/public/favicon.ico b/examples/web-wa-sqlite/public/favicon.ico index 63561c5c..e55095b9 100644 Binary files a/examples/web-wa-sqlite/public/favicon.ico and b/examples/web-wa-sqlite/public/favicon.ico differ diff --git a/examples/web-wa-sqlite/src/App.css b/examples/web-wa-sqlite/src/App.css index 9b61c181..adf1da6e 100644 --- a/examples/web-wa-sqlite/src/App.css +++ b/examples/web-wa-sqlite/src/App.css @@ -3,7 +3,7 @@ } .App-logo { - height: min(160px, 30vmin); + height: min(132px, 30vmin); pointer-events: none; margin-top: min(30px, 5vmin); margin-bottom: min(30px, 5vmin); diff --git a/examples/web-wa-sqlite/src/logo.svg b/examples/web-wa-sqlite/src/logo.svg index 5981412e..f5ec440a 100644 --- a/examples/web-wa-sqlite/src/logo.svg +++ b/examples/web-wa-sqlite/src/logo.svg @@ -1,16 +1,11 @@ - - - ElectricSQL Icon (Alt) - - - - - - - - - + + +