Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -49,11 +49,14 @@ We use the following icons for the SDKs and backend databases:
- Web: `icon="js"`
- Kotlin: `icon="k"`
- Swift: `icon="swift"`
- Node.js: `icon="node-js"`
- .NET: `icon="wave-sine"`

#### Some useful references:
- Writing content: https://mintlify.com/docs/page
- Available components: https://mintlify.com/docs/content/components/accordions
- Global settings: https://mintlify.com/docs/settings/global
- Reusable Snippets for repeated content: https://mintlify.com/docs/reusable-snippets

### Publishing Changes

Expand Down
9 changes: 9 additions & 0 deletions client-sdk-references/dotnet.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
---
title: ".NET (closed alpha)"
description: "SDK reference for using PowerSync in .NET clients."
sidebarTitle: Overview
---

<Note>
Our .NET client SDK is currently in a closed alpha release for early testing with select customers. You can explore the repo [here](https://github.com/powersync-ja/powersync-dotnet), however it is not yet officially published so expect breaking changes and instability as development continues.
</Note>
17 changes: 3 additions & 14 deletions client-sdk-references/introduction.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -3,19 +3,8 @@ title: "Introduction"
description: "PowerSync supports multiple client-side frameworks with official SDKs"
---

import ClientSdks from '/snippets/client-sdks.mdx';

Select your client framework for the full SDK reference, getting started instructions and example code:

<CardGroup cols={3}>
<Card title="Flutter" icon="flutter" href="/client-sdk-references/flutter">
</Card>
<Card title="React Native & Expo" icon="react" href="/client-sdk-references/react-native-and-expo">
</Card>
<Card title="JavaScript/Web" icon="js" href="/client-sdk-references/javascript-web">
</Card>
<Card title="Kotlin Multiplatform" icon="k" href="/client-sdk-references/kotlin-multiplatform">
Currently in a beta release.
</Card>
<Card title="Swift" icon="swift" href="/client-sdk-references/swift">
Currently in a beta release.
</Card>
</CardGroup>
<ClientSdks />
194 changes: 194 additions & 0 deletions client-sdk-references/node.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,194 @@
---
title: "Node.js client (alpha)"
description: "SDK reference for using PowerSync in Node.js clients."
sidebarTitle: Overview
---

<Note>
This page describes the PowerSync _client_ SDK for Node.js.
If you're interested in using PowerSync for your Node.js backend, no special package is required.
Instead, follow our guides on [app backend setup](/installation/app-backend-setup).
</Note>

<CardGroup>
<Card title="PowerSync SDK on NPM" icon="npm" href="https://www.npmjs.com/package/@powersync/node">
This SDK is distributed via NPM [\[External link\].](https://www.npmjs.com/package/@powersync/node)
</Card>

<Card title="Source Code" icon="github" href="https://github.com/powersync-ja/powersync-js/tree/main/packages/node">
Refer to packages/node in the powersync-js repo on GitHub.
</Card>

<Card title="API Reference" icon="book" href="https://powersync-ja.github.io/powersync-js/node-sdk">
Full API reference for the PowerSync SDK [\[External link\].](https://powersync-ja.github.io/powersync-js/node-sdk)
</Card>

<Card title="Example Project" icon="code" href="https://github.com/powersync-ja/powersync-js/tree/main/demos/example-node">
A small CLI app showcasing bidirectional sync.
</Card>
</CardGroup>

## SDK Features

* Provides real-time streaming of database changes.
* Offers direct access to the SQLite database, enabling the use of SQL on both client and server sides.
* Operations run on a background worker and are asynchronous by default, enabling concurrent queries.
* Enables subscription to queries for receiving live updates.
* Eliminates the need for client-side database migrations as these are managed automatically.

## Quickstart

To start using PowerSync in a Node client, first add the dependencies:

<Tabs>
<Tab title="npm">
```bash
npm install @powersync/node
```
</Tab>
<Tab title="yarn">
```bash
yarn add @powersync/node
```
</Tab>
<Tab title="pnpm">
```bash
pnpm install @powersync/node
```
</Tab>
</Tabs>

Depending on the package manager used, you might have to approve install scripts.
PowerSync currently requires install scripts on the `@powersync/node` and `@powersync/better-sqlite3` packages
to download native addons.

Check warning on line 63 in client-sdk-references/node.mdx

View check run for this annotation

Mintlify / Mintlify Validation - vale-spellcheck

client-sdk-references/node.mdx#L63

Did you really mean 'addons'?

Next, make sure that you have:

* Signed up for a PowerSync Cloud account ([here](https://accounts.journeyapps.com/portal/powersync-signup?s=docs)) or [self-host PowerSync](/self-hosting/getting-started).
* [Configured your backend database](/installation/database-setup) and connected it to your PowerSync instance.

### 1. Define the schema

The first step is defining the schema for the local SQLite database.

This schema represents a "view" of the downloaded data. No migrations are required — the schema is applied directly when the local PowerSync database is constructed (as we'll show in the next step).
You can use [this example](https://github.com/powersync-ja/powersync-js/blob/e5a57a539150f4bc174e109d3898b6e533de272f/demos/example-node/src/powersync.ts#L47-L77) as a reference when defining your schema.

<Info>
**Generate schema automatically**

In the [dashboard](/usage/tools/powersync-dashboard), the schema can be generated based off your sync rules by right-clicking on an instance and selecting **Generate client-side schema**.
Select JavaScript and replace the suggested import with `@powersync/node`.

Similar functionality exists in the [CLI](/usage/tools/cli).
</Info>

### 2. Instantiate the PowerSync Database

Next, you need to instantiate the PowerSync database — this is the core managed database.

Its primary functions are to record all changes in the local database, whether online or offline. In addition, it automatically uploads changes to your app backend when connected.

**Example**:

```js
import { PowerSyncDatabase } from '@powersync/node';
import { Connector } from './Connector';
import { AppSchema } from './Schema';

export const db = new PowerSyncDatabase({
// The schema you defined in the previous step
schema: AppSchema,
database: {
// Filename for the SQLite database — it's important to only instantiate one instance per file.
dbFilename: 'powersync.db',
// Optional. Directory where the database file is located.'
// dbLocation: 'path/to/directory'
},
});
```

### 3. Integrate with your Backend

The PowerSync backend connector provides the connection between your application backend and the PowerSync client-slide managed SQLite database.

It is used to:

1. Retrieve an auth token to connect to the PowerSync instance.
2. Apply local changes on your backend application server (and from there, to Postgres)

Accordingly, the connector must implement two methods:

1. [PowerSyncBackendConnector.fetchCredentials](https://github.com/powersync-ja/powersync-js/blob/ed5bb49b5a1dc579050304fab847feb8d09b45c7/packages/common/src/client/connection/PowerSyncBackendConnector.ts#L16) - This is called every couple of minutes and is used to obtain credentials for your app backend API. -> See [Authentication Setup](/installation/authentication-setup) for instructions on how the credentials should be generated.
2. [PowerSyncBackendConnector.uploadData](https://github.com/powersync-ja/powersync-js/blob/ed5bb49b5a1dc579050304fab847feb8d09b45c7/packages/common/src/client/connection/PowerSyncBackendConnector.ts#L24) - Use this to upload client-side changes to your app backend.
-> See [Writing Client Changes](/installation/app-backend-setup/writing-client-changes) for considerations on the app backend implementation.

**Example**:

```js
import { UpdateType } from '@powersync/node';

export class Connector implements PowerSyncBackendConnector {
constructor() {
// Setup a connection to your server for uploads
this.serverConnectionClient = TODO;
}

async fetchCredentials() {
// Implement fetchCredentials to obtain a JWT from your authentication service.
// See https://docs.powersync.com/installation/authentication-setup
// If you're using Supabase or Firebase, you can re-use the JWT from those clients, see
// - https://docs.powersync.com/installation/authentication-setup/supabase-auth
// - https://docs.powersync.com/installation/authentication-setup/firebase-auth
return {
endpoint: '[Your PowerSync instance URL or self-hosted endpoint]',
// Use a development token (see Authentication Setup https://docs.powersync.com/installation/authentication-setup/development-tokens) to get up and running quickly
token: 'An authentication token'
};
}

async uploadData(database) {
// Implement uploadData to send local changes to your backend service.
// You can omit this method if you only want to sync data from the database to the client

// See example implementation here: https://docs.powersync.com/client-sdk-references/javascript-web#3-integrate-with-your-backend
}
}
```

With your database instantiated and your connector ready, call `connect` to start the synchronization process:

```js
await db.connect(new Connector());
await db.waitForFirstSync(); // Optional, to wait for a complete snapshot of data to be available
```

## Usage

After connecting the client database, it is ready to be used. The API to run queries and updates is identical to our
[web SDK](/client-sdk-references/javascript-web#using-powersync%3A-crud-functions):

```js
// Use db.get() to fetch a single row:
console.log(await db.get('SELECT powersync_rs_version();'));

// Or db.all() to fetch all:
console.log(await db.all('SELECT * FROM lists;'));

// Use db.watch() to watch queries for changes:
const watchLists = async () => {
for await (const rows of db.watch('SELECT * FROM lists;')) {
console.log('Has todo lists', rows.rows!._array);
}
};
watchLists();

// And db.execute for inserts, updates and deletes:
await db.execute(
"INSERT INTO lists (id, created_at, name, owner_id) VALUEs (uuid(), datetime('now'), ?, uuid());",
['My new list']
);
```

PowerSync runs queries asynchronously on a background pool of workers and automatically configures WAL to
allow a writer and multiple readers to operate in parallel.
5 changes: 5 additions & 0 deletions client-sdk-references/node/javascript-orm-support.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
title: "JavaScript ORM Support"
url: /client-sdk-references/javascript-web/javascript-orm
sidebarTitle: "ORM Support"
---
28 changes: 28 additions & 0 deletions installation/client-side-setup.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -207,6 +207,34 @@ Please see the steps based on your app framework:
<Card title="Swift (Beta)" icon="swift" href="/client-sdk-references/swift" horizontal />
</Accordion>

<Accordion title="Node.js" icon="node-js">
Add the [PowerSync Node NPM package](https://www.npmjs.com/package/@powersync/node) to your project:

<Tabs>
<Tab title="npm">
```bash
npm install @powersync/node
```
</Tab>

<Tab title="yarn">
```bash
yarn add @powersync/node
```
</Tab>

<Tab title="pnpm">
```bash
pnpm install @powersync/node
```
</Tab>
</Tabs>

See the full SDK reference for further details and getting started instructions:

<Card title="Node.js (client)" icon="node-js" href="/client-sdk-references/node" horizontal />
</Accordion>

## Next Steps

For an overview of the client-side steps required to set up PowerSync in your app, continue reading the next sections.
Expand Down
7 changes: 6 additions & 1 deletion installation/client-side-setup/define-your-schema.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -27,10 +27,14 @@ For an example implementation of the client-side schema, see the _Getting Starte

* [1\. Define the Schema](/client-sdk-references/react-native-and-expo#1-define-the-schema)

### <Icon icon="js" iconType="solid" size="24"/> JavaScript Web
### <Icon icon="js" iconType="solid" size="24"/> JavaScript/Web

* [1\. Define the Schema](/client-sdk-references/javascript-web#1-define-the-schema)

### <Icon icon="node-js" iconType="solid" size="24"/> JavaScript/Node.js (alpha)

* [1\. Define the Schema](/client-sdk-references/node#1-define-the-schema)

### <Icon icon="k" iconType="solid" size="24"/> Kotlin Multiplatform

* [1\. Define the Schema](/client-sdk-references/kotlin-multiplatform#1-define-the-schema)
Expand All @@ -39,6 +43,7 @@ For an example implementation of the client-side schema, see the _Getting Starte

* [1\. Define the Schema](/client-sdk-references/swift#1-define-the-schema)


## ORM Support

For details on ORM support in PowerSync, refer to [Using ORMs with PowerSync](https://www.powersync.com/blog/using-orms-with-powersync) on our blog.
Original file line number Diff line number Diff line change
Expand Up @@ -17,10 +17,14 @@ For an example implementation of instantiating the client-side database, see the

* [2\. Instantiate the PowerSync Database](/client-sdk-references/react-native-and-expo#2-instantiate-the-powersync-database)

### <Icon icon="js" iconType="solid" size="24"/> JavaScript Web
### <Icon icon="js" iconType="solid" size="24"/> JavaScript/Web

* [2\. Instantiate the PowerSync Database](/client-sdk-references/javascript-web#2-instantiate-the-powersync-database)

### <Icon icon="node-js" iconType="solid" size="24"/> JavaScript/Node.js (alpha)

* [2\. Instantiate the PowerSync Database](/client-sdk-references/node#2-instantiate-the-powersync-database)

### <Icon icon="k" iconType="solid" size="24"/> Kotlin Multiplatform

* [2\. Instantiate the PowerSync Database](/client-sdk-references/kotlin-multiplatform#2-instantiate-the-powersync-database)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -27,10 +27,14 @@ For an example implementation of a PowerSync 'backend connector', see the _Getti

* [3\. Integrate with your Backend](/client-sdk-references/react-native-and-expo#3-integrate-with-your-backend)

### <Icon icon="js" iconType="solid" size="24"/> JavaScript Web
### <Icon icon="js" iconType="solid" size="24"/> JavaScript/Web

* [3\. Integrate with your Backend](/client-sdk-references/javascript-web#3-integrate-with-your-backend)

### <Icon icon="node-js" iconType="solid" size="24"/> JavaScript/Node.js (alpha)

* [3\. Integrate with your Backend](/client-sdk-references/node#3-integrate-with-your-backend)

### <Icon icon="k" iconType="solid" size="24"/> Kotlin Multiplatform

* [3\. Integrate with your Backend](/client-sdk-references/kotlin-multiplatform#3-integrate-with-your-backend)
Expand Down
11 changes: 9 additions & 2 deletions installation/quickstart-guide.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,14 @@ title: "Quickstart Guide / Installation Overview"
sidebarTitle: "Quickstart / Overview"
---

PowerSync is designed to be stack agnostic, and currently supports **Postgres**, **MongoDB** and **MySQL** (alpha) as the source database, and has official SDKs for [**Flutter**](/client-sdk-references/flutter) (mobile and [web](/client-sdk-references/flutter/flutter-web-support)), [**React Native**](/client-sdk-references/react-native-and-expo) (mobile and [web](/client-sdk-references/react-native-and-expo/react-native-web-support)), [**JavaScript/Web**](/client-sdk-references/javascript-web) (vanilla JS, React, Vue), [**Kotlin Multiplatform**](/client-sdk-references/kotlin-multiplatform) (beta) and [**Swift**](/client-sdk-references/swift) (beta) available on the client-side today.
PowerSync is designed to be stack agnostic, and currently supports **Postgres**, **MongoDB** and **MySQL** (alpha) as the source database, and has the following official client-side SDKs available today:
- [**Flutter**](/client-sdk-references/flutter) (mobile and [web](/client-sdk-references/flutter/flutter-web-support))
- [**React Native**](/client-sdk-references/react-native-and-expo) (mobile and [web](/client-sdk-references/react-native-and-expo/react-native-web-support))
- [**JavaScript/Web**](/client-sdk-references/javascript-web) (vanilla JS, React, Vue)
- [**JavaScript/Node.js**](/client-sdk-references/node) (alpha)
- [**Kotlin Multiplatform**](/client-sdk-references/kotlin-multiplatform) (beta)
- [**Swift**](/client-sdk-references/swift) (beta)
- [**.NET**](/client-sdk-references/dotnet) (closed alpha)

<Note>
Support for additional platforms is on our [Roadmap](https://roadmap.powersync.com/). If one isn't supported today, please add your vote and check back soon.
Expand Down Expand Up @@ -42,7 +49,7 @@ The following outlines our recommended steps to implement PowerSync in your proj
<Step title="Implement PowerSync on the Client-Side">
Implement an app using one of our Client SDKs:
1. To start, you can continue using your Development Token.
2. Implement a "Hello World" app to quickly get a feel, **or** jump straight into installing the client SDK in your existing app — see [Client-Side Setup](/installation/client-side-setup) or follow end-to-end getting started instructions in the [full SDK reference](https://docs.powersync.com/client-sdk-references/introduction).
2. Implement a "Hello World" app to quickly get a feel, **or** jump straight into installing the client SDK in your existing app — see [Client-Side Setup](/installation/client-side-setup) or follow end-to-end getting started instructions in the [full SDK reference](/client-sdk-references/introduction).
3. Verify that downloads from your source database are working. Data should reflect in your UI and you can also [inspect the SQLite database](/resources/troubleshooting#inspect-local-sqlite-database).
</Step>
<Step title="Implement Authentication">
Expand Down
6 changes: 3 additions & 3 deletions integration-guides/flutterflow-+-powersync.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@

* No more dozens of custom actions

* Working Attachments package (Coming soon)
* Working Attachments package (Guide coming soon)

Note that using libraries in FlutterFlow requires being on a [paid plan with FlutterFlow](https://www.flutterflow.io/pricing). If this is not an option for you, you can use our [legacy guide](/integration-guides/flutterflow-+-powersync/powersync-+-flutterflow-legacy) with custom code to integrate PowerSync in your FlutterFlow project.
</Tip>
Expand Down Expand Up @@ -51,7 +51,7 @@

5. Create Data

6. Update Data (Coming soon)
6. Update Data (Guide coming soon)

7. Delete Data

Expand Down Expand Up @@ -387,7 +387,7 @@
5. Still under "Component Parameters" add the SQL query to fetch all list items from the SQLite database:

1. Paste the following into the "sql \[String]" field:
`select * from lists order by created_at;`

Check warning on line 390 in integration-guides/flutterflow-+-powersync.mdx

View check run for this annotation

Mintlify / Mintlify Validation - vale-spellcheck

integration-guides/flutterflow-+-powersync.mdx#L390

Did you really mean 'created_at'?

2. For this query there are no parameters - this will be covered further down in the guide.

Expand Down Expand Up @@ -497,7 +497,7 @@
<img src="/images/integration-guides/flutterflow/json-parameters.png" />
</Frame>

5. Still under "Component Parameters", configure the "onData" action:

Check warning on line 500 in integration-guides/flutterflow-+-powersync.mdx

View check run for this annotation

Mintlify / Mintlify Validation - vale-spellcheck

integration-guides/flutterflow-+-powersync.mdx#L500

Did you really mean 'onData'?

1) Open the "Action Flow Editor".

Expand Down Expand Up @@ -638,7 +638,7 @@
## Update Data

<Info>
This section is a work in progress. Please reach out on [our Discord](https://discord.gg/powersync) if you have any questions.
Updating data is possible today using the `powersyncWrite` helper of the Library, and a guide will be published soon. In the mean time, use the section below about [Deleting Data](#delete-data) as a reference. Please reach out on [our Discord](https://discord.gg/powersync) if you have any questions.
</Info>

## Delete Data
Expand Down Expand Up @@ -759,7 +759,7 @@

## (Optional) Display Connectivity and Sync Status

The PowerSync library provides a built-in component that displays real-time connectivity and synchronization status. Since the sync state is available globally as part of your app state, you can easily monitor the database status throughout your application. To add this status indicator:

Check warning on line 762 in integration-guides/flutterflow-+-powersync.mdx

View check run for this annotation

Mintlify / Mintlify Validation - vale-spellcheck

integration-guides/flutterflow-+-powersync.mdx#L762

Did you really mean 'ato'?

1. Under the **Widget Palette**, select the "Components and custom widgets imported from library projects" panel.

Expand Down
Loading