diff --git a/client-sdks/overview.mdx b/client-sdks/overview.mdx index 914587f0..36e1b29e 100644 --- a/client-sdks/overview.mdx +++ b/client-sdks/overview.mdx @@ -5,6 +5,7 @@ sidebarTitle: "Overview" --- import ClientSdks from '/snippets/client-sdks.mdx'; +import { PowerSyncCardGroup } from '/snippets/shared/powersync-card-group.jsx'; PowerSync provides client SDKs for multiple frameworks. Each SDK manages a local SQLite database that syncs with your backend. @@ -14,7 +15,9 @@ For getting started instructions, see our [Setup Guide](/intro/setup-guide). Select your client framework to get started: - + + + ## Common Tasks @@ -37,7 +40,7 @@ Once you've installed an SDK, these guides cover the core functionality: ## Additional Resources - + Use type-safe ORMs with PowerSync @@ -47,5 +50,5 @@ Once you've installed an SDK, these guides cover the core functionality: Working demo apps and starter templates - + diff --git a/client-sdks/reference/capacitor.mdx b/client-sdks/reference/capacitor.mdx index 3888fd2e..d9f3a684 100644 --- a/client-sdks/reference/capacitor.mdx +++ b/client-sdks/reference/capacitor.mdx @@ -15,12 +15,13 @@ import SubscribeSyncStreamsIntro from '/snippets/subscribe-sync-streams-intro.md import SubscribeSyncStreamsOutro from '/snippets/subscribe-sync-streams-outro.mdx'; import JavaScriptSubscribeSyncStream from '/snippets/javascript/subscribe-sync-stream.mdx'; import LocalOnly from '/snippets/local-only-escape.mdx'; +import { PowerSyncCardGroup } from '/snippets/shared/powersync-card-group.jsx'; ```text Build with AI icon="sparkles" wrap Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skills. Then follow the skills to onboard this project to PowerSync using the Capacitor SDK. ``` - + This SDK is distributed via NPM @@ -36,7 +37,7 @@ Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skill Changelog for the SDK - + This SDK is currently in a [**beta** release](/resources/feature-status). diff --git a/client-sdks/reference/dotnet.mdx b/client-sdks/reference/dotnet.mdx index 8cf1d104..07bd868b 100644 --- a/client-sdks/reference/dotnet.mdx +++ b/client-sdks/reference/dotnet.mdx @@ -10,6 +10,7 @@ import DotNetWatch from '/snippets/dotnet/basic-watch-query.mdx'; import GenerateSchemaAutomatically from '/snippets/generate-schema-automatically.mdx'; import SdkClientSideSchema from '/snippets/sdk-client-side-schema.mdx'; import LocalOnly from '/snippets/local-only-escape.mdx'; +import { PowerSyncCardGroup } from '/snippets/shared/powersync-card-group.jsx'; import SubscribeSyncStreamsIntro from '/snippets/subscribe-sync-streams-intro.mdx'; import SubscribeSyncStreamsOutro from '/snippets/subscribe-sync-streams-outro.mdx'; import DotnetSubscribeSyncStream from '/snippets/dotnet/subscribe-sync-stream.mdx'; @@ -18,7 +19,7 @@ import DotnetSubscribeSyncStream from '/snippets/dotnet/subscribe-sync-stream.md Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skills. Then follow the skills to onboard this project to PowerSync using the .NET SDK. ``` - + This SDK is distributed via NuGet @@ -38,7 +39,7 @@ Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skill Changelog for the SDK - + This SDK is currently in a [**beta** release](/resources/feature-status). It is production-ready for tested use cases. APIs are stable, and we communicate breaking changes clearly. diff --git a/client-sdks/reference/flutter.mdx b/client-sdks/reference/flutter.mdx index c182960a..11b71b59 100644 --- a/client-sdks/reference/flutter.mdx +++ b/client-sdks/reference/flutter.mdx @@ -10,6 +10,7 @@ import FlutterWatch from '/snippets/flutter/basic-watch-query.mdx'; import GenerateSchemaAutomatically from '/snippets/generate-schema-automatically.mdx'; import SdkClientSideSchema from '/snippets/sdk-client-side-schema.mdx'; import LocalOnly from '/snippets/local-only-escape.mdx'; +import { PowerSyncCardGroup } from '/snippets/shared/powersync-card-group.jsx'; import SubscribeSyncStreamsIntro from '/snippets/subscribe-sync-streams-intro.mdx'; import SubscribeSyncStreamsOutro from '/snippets/subscribe-sync-streams-outro.mdx'; import FlutterSubscribeSyncStream from '/snippets/flutter/subscribe-sync-stream.mdx'; @@ -18,7 +19,8 @@ import FlutterSubscribeSyncStream from '/snippets/flutter/subscribe-sync-stream. Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skills. Then follow the skills to onboard this project to PowerSync using the Dart/Flutter SDK. ``` - + + The SDK is distributed via pub.dev @@ -34,7 +36,7 @@ Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skill Changelog for the SDK - + ## Quickstart diff --git a/client-sdks/reference/javascript-web.mdx b/client-sdks/reference/javascript-web.mdx index 84c5477d..d9164945 100644 --- a/client-sdks/reference/javascript-web.mdx +++ b/client-sdks/reference/javascript-web.mdx @@ -15,6 +15,7 @@ import SubscribeSyncStreamsOutro from '/snippets/subscribe-sync-streams-outro.md import JavaScriptSubscribeSyncStream from '/snippets/javascript/subscribe-sync-stream.mdx'; import MutationConfirmationWithReturning from '/snippets/javascript-mutation-confirmation-returning.mdx'; import LocalOnly from '/snippets/local-only-escape.mdx'; +import { PowerSyncCardGroup } from '/snippets/shared/powersync-card-group.jsx'; The PowerSync JavaScript Web SDK runs SQLite in the browser and keeps it in sync with your backend database. Your UI reads and writes local data directly, so interactions feel instant because they do not wait on network round trips. Watch queries emit new results as local or synced data changes, keeping the UI current without polling. @@ -24,7 +25,7 @@ With Sync Streams, you define the subset of backend data each client receives ra Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skills. Then follow the skills to onboard this project to PowerSync using the JavaScript Web SDK. ``` - + This SDK is distributed via NPM @@ -40,7 +41,7 @@ Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skill Changelog for the SDK - + ## SDK Features diff --git a/client-sdks/reference/kotlin.mdx b/client-sdks/reference/kotlin.mdx index d9ca2e5e..34914a87 100644 --- a/client-sdks/reference/kotlin.mdx +++ b/client-sdks/reference/kotlin.mdx @@ -10,6 +10,7 @@ import KotlinWatch from '/snippets/kotlin/basic-watch-query.mdx'; import GenerateSchemaAutomatically from '/snippets/generate-schema-automatically.mdx'; import SdkClientSideSchema from '/snippets/sdk-client-side-schema.mdx'; import LocalOnly from '/snippets/local-only-escape.mdx'; +import { PowerSyncCardGroup } from '/snippets/shared/powersync-card-group.jsx'; import SubscribeSyncStreamsIntro from '/snippets/subscribe-sync-streams-intro.mdx'; import SubscribeSyncStreamsOutro from '/snippets/subscribe-sync-streams-outro.mdx'; import KotlinSubscribeSyncStream from '/snippets/kotlin/subscribe-sync-stream.mdx'; @@ -18,7 +19,7 @@ import KotlinSubscribeSyncStream from '/snippets/kotlin/subscribe-sync-stream.md Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skills. Then follow the skills to onboard this project to PowerSync using the Kotlin Multiplatform SDK. ``` - + The PowerSync Kotlin SDK is distributed via Maven Central @@ -34,7 +35,7 @@ Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skill Changelog for the SDK - + ## SDK Features diff --git a/client-sdks/reference/node.mdx b/client-sdks/reference/node.mdx index 13e78c51..d8d0956e 100644 --- a/client-sdks/reference/node.mdx +++ b/client-sdks/reference/node.mdx @@ -15,6 +15,7 @@ import SubscribeSyncStreamsIntro from '/snippets/subscribe-sync-streams-intro.md import SubscribeSyncStreamsOutro from '/snippets/subscribe-sync-streams-outro.mdx'; import JavaScriptSubscribeSyncStream from '/snippets/javascript/subscribe-sync-stream.mdx'; import LocalOnly from '/snippets/local-only-escape.mdx'; +import { PowerSyncCardGroup } from '/snippets/shared/powersync-card-group.jsx'; This page describes the PowerSync _client_ SDK for Node.js. @@ -26,7 +27,7 @@ import LocalOnly from '/snippets/local-only-escape.mdx'; Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skills. Then follow the skills to onboard this project to PowerSync using the Node.js client SDK. ``` - + This SDK is distributed via NPM @@ -46,7 +47,7 @@ Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skill Changelog for the SDK - + ## SDK Features diff --git a/client-sdks/reference/react-native-and-expo.mdx b/client-sdks/reference/react-native-and-expo.mdx index b8472ac2..17599dd3 100644 --- a/client-sdks/reference/react-native-and-expo.mdx +++ b/client-sdks/reference/react-native-and-expo.mdx @@ -15,12 +15,13 @@ import SubscribeSyncStreamsIntro from '/snippets/subscribe-sync-streams-intro.md import SubscribeSyncStreamsOutro from '/snippets/subscribe-sync-streams-outro.mdx'; import JavaScriptSubscribeSyncStream from '/snippets/javascript/subscribe-sync-stream.mdx'; import LocalOnly from '/snippets/local-only-escape.mdx'; +import { PowerSyncCardGroup } from '/snippets/shared/powersync-card-group.jsx'; ```text Build with AI icon="sparkles" wrap Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skills. Then follow the skills to onboard this project to PowerSync using the React Native & Expo SDK. ``` - + This SDK is distributed via NPM @@ -36,7 +37,7 @@ Full API reference for the SDK Changelog for the SDK - + ## SDK Features diff --git a/client-sdks/reference/rust.mdx b/client-sdks/reference/rust.mdx index 47d790aa..38e25540 100644 --- a/client-sdks/reference/rust.mdx +++ b/client-sdks/reference/rust.mdx @@ -10,6 +10,7 @@ import RustWatchQuery from '/snippets/rust/basic-watch-query.mdx'; import GenerateSchemaAutomatically from '/snippets/generate-schema-automatically.mdx'; import SdkClientSideSchema from '/snippets/sdk-client-side-schema.mdx'; import LocalOnly from '/snippets/local-only-escape.mdx'; +import { PowerSyncCardGroup } from '/snippets/shared/powersync-card-group.jsx'; import SubscribeSyncStreamsIntro from '/snippets/subscribe-sync-streams-intro.mdx'; import SubscribeSyncStreamsOutro from '/snippets/subscribe-sync-streams-outro.mdx'; import RustSubscribeSyncStream from '/snippets/rust/subscribe-sync-stream.mdx'; @@ -22,7 +23,7 @@ import RustSubscribeSyncStream from '/snippets/rust/subscribe-sync-stream.mdx'; Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skills. Then follow the skills to onboard this project to PowerSync using the Rust SDK. ``` - + The SDK is distributed via crates.io @@ -38,7 +39,7 @@ Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skill Changelog for the SDK - + ## SDK Features diff --git a/client-sdks/reference/swift.mdx b/client-sdks/reference/swift.mdx index c98f4852..028a1b12 100644 --- a/client-sdks/reference/swift.mdx +++ b/client-sdks/reference/swift.mdx @@ -10,6 +10,7 @@ import SwiftWatch from '/snippets/swift/basic-watch-query.mdx'; import GenerateSchemaAutomatically from '/snippets/generate-schema-automatically.mdx'; import SdkClientSideSchema from '/snippets/sdk-client-side-schema.mdx'; import LocalOnly from '/snippets/local-only-escape.mdx'; +import { PowerSyncCardGroup } from '/snippets/shared/powersync-card-group.jsx'; import SubscribeSyncStreamsIntro from '/snippets/subscribe-sync-streams-intro.mdx'; import SubscribeSyncStreamsOutro from '/snippets/subscribe-sync-streams-outro.mdx'; import SwiftSubscribeSyncStream from '/snippets/swift/subscribe-sync-stream.mdx'; @@ -18,7 +19,7 @@ import SwiftSubscribeSyncStream from '/snippets/swift/subscribe-sync-stream.mdx' Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skills. Then follow the skills to onboard this project to PowerSync using the Swift SDK. ``` - + Refer to the `powersync-swift` repo on GitHub @@ -31,7 +32,7 @@ Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skill Changelog for the SDK - + Up to v1.13, the Swift SDK wrapped a PowerSync Kotlin XCFramework behind Swift protocols. diff --git a/client-sdks/reference/tauri.mdx b/client-sdks/reference/tauri.mdx index 26232c8d..55525d0b 100644 --- a/client-sdks/reference/tauri.mdx +++ b/client-sdks/reference/tauri.mdx @@ -11,6 +11,7 @@ import JavaScriptCallbackWatch from '/snippets/basic-watch-query-javascript-call import GenerateSchemaAutomatically from '/snippets/generate-schema-automatically.mdx'; import SdkClientSideSchema from '/snippets/sdk-client-side-schema.mdx'; import MutationConfirmationWithReturning from '/snippets/javascript-mutation-confirmation-returning.mdx'; +import { PowerSyncCardGroup } from '/snippets/shared/powersync-card-group.jsx'; import SubscribeSyncStreamsIntro from '/snippets/subscribe-sync-streams-intro.mdx'; import SubscribeSyncStreamsOutro from '/snippets/subscribe-sync-streams-outro.mdx'; import JavaScriptSubscribeSyncStream from '/snippets/javascript/subscribe-sync-stream.mdx'; @@ -19,7 +20,7 @@ import JavaScriptSubscribeSyncStream from '/snippets/javascript/subscribe-sync-s Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skills. Then follow the skills to onboard this project to PowerSync using the Tauri SDK. ``` - + The JavaScript part of the SDK is distributed via NPM @@ -38,7 +39,7 @@ Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skill Changelog for the SDK - + This SDK is currently in [**alpha**](/resources/feature-status), intended for external testing and public feedback. While it exposes the same stable JavaScript APIs as other PowerSync JavaScript SDKs, the underlying [Rust SDK](/client-sdks/reference/rust) and the IPC protocol between the JavaScript and Rust packages are subject to change. Expect breaking changes and instability as development continues. diff --git a/configuration/app-backend/client-side-integration.mdx b/configuration/app-backend/client-side-integration.mdx index 8768f56b..2618e078 100644 --- a/configuration/app-backend/client-side-integration.mdx +++ b/configuration/app-backend/client-side-integration.mdx @@ -4,6 +4,8 @@ sidebarTitle: "Client-Side Integration" description: "Connect your client app to a PowerSync-compatible backend using the connector interface and upload queue." --- +import { PowerSyncCardGroup } from '/snippets/shared/powersync-card-group.jsx'; + ## How PowerSync Uses Your Backend After you've [instantiated](/intro/setup-guide#instantiate-the-powersync-database) the client-side PowerSync database, you will call `connect()` on it, which causes the PowerSync Client SDK to connect to the [PowerSync Service](/architecture/powersync-service) for the purpose of syncing data to the client-side SQLite database, _and_ to connect to your backend application as needed, for two potential purposes: @@ -164,7 +166,7 @@ The PowerSync sync token is used exclusively for the connection between the Clie For an example implementation of a PowerSync 'backend connector', see the SDK guide for your platform: - + @@ -175,7 +177,7 @@ For an example implementation of a PowerSync 'backend connector', see the SDK gu - + ## More Examples diff --git a/intro/powersync-overview.mdx b/intro/powersync-overview.mdx index 02af503d..238115df 100644 --- a/intro/powersync-overview.mdx +++ b/intro/powersync-overview.mdx @@ -5,6 +5,7 @@ sidebarTitle: Introduction --- import ClientSdks from '/snippets/client-sdks.mdx'; +import { PowerSyncCardGroup } from '/snippets/shared/powersync-card-group.jsx'; PowerSync is made up of the PowerSync Service and a set of client SDKs. The PowerSync Service replicates data from your backend database, partitions it based on what data each user should receive, and streams real-time updates to clients through the PowerSync client SDK. @@ -32,7 +33,9 @@ Install the PowerSync Agent Skills with: npx skills add powersync-ja/agent-skill PowerSync is also designed to be client-side stack agnostic, and currently has client SDKs available for: + + Looking for an SDK that's not listed above? Upvote it or submit it on [our roadmap](https://roadmap.powersync.com/). @@ -42,7 +45,7 @@ PowerSync is also designed to be client-side stack agnostic, and currently has c PowerSync is designed to be backend database agnostic, and supports these source databases: - + @@ -54,7 +57,7 @@ PowerSync is designed to be backend database agnostic, and supports these source - + ## Need Help? diff --git a/snippets/client-sdks.mdx b/snippets/client-sdks.mdx index b2aae4d6..3dd48362 100644 --- a/snippets/client-sdks.mdx +++ b/snippets/client-sdks.mdx @@ -1,21 +1,19 @@ - - + - + - + - + - + - + - + - + - + - - + diff --git a/snippets/shared/powersync-card-group.jsx b/snippets/shared/powersync-card-group.jsx new file mode 100644 index 00000000..5b51e526 --- /dev/null +++ b/snippets/shared/powersync-card-group.jsx @@ -0,0 +1,7 @@ +export const PowerSyncCardGroup = ({ children }) => { + return ( +
+ {children} +
+ ) +} diff --git a/tools/cli.mdx b/tools/cli.mdx index 50b3926a..a8c89cf8 100644 --- a/tools/cli.mdx +++ b/tools/cli.mdx @@ -3,7 +3,9 @@ title: "CLI" description: "Manage PowerSync Cloud and self-hosted instances from the command line." --- - +import { PowerSyncCardGroup } from '/snippets/shared/powersync-card-group.jsx'; + + Changelog for the CLI - + The PowerSync CLI lets you manage PowerSync Service instances, deploy Sync Config (your Sync Streams or Sync Rules), generate client schemas, run diagnostics, and more. It is distributed as the [powersync](https://www.npmjs.com/package/powersync) npm package.