Skip to main content

2 - Syncing data

2-1 Set up subscription

You must create a subscription object in the global scope so that ditto synchronizes in the background throughout the duration of the program.

import { init, Ditto } from '@dittolive/ditto'
let dittolet subscriptionlet liveQuery
async function main () {  await init()
  ditto = new Ditto({ type: 'onlinePlayground', appID: 'YOUR_APP_ID', token: 'YOUR_TOKEN_HERE'})  ditto.startSync()
  // Start a subscription  subscription = ditto.store.collection("tasks").find("isDeleted == false").subscribe()

}
main()

2-2 Listen to changes

Now, every time there is a change to a document, you can retrieve those documents and print them out to the console. Use observeLocal() for this, as seen below:

import { init, Ditto } from '@dittolive/ditto'
let dittolet subscriptionlet liveQuery
async function main () {  await init()
  ditto = new Ditto({ type: 'onlinePlayground', appID: 'YOUR_APP_ID', token: 'YOUR_TOKEN_HERE'})  ditto.startSync()
  subscription = ditto.store.collection("tasks").find("isDeleted == false").subscribe()
  // Listen for changes  liveQuery = ditto.store.collection("tasks").find("isDeleted == false").observeLocal((docs, event) => {    console.log(docs)  })
  ditto.store.collection("tasks").upsert({    isCompleted: false,    isDeleted: false,    body: "Hello world!"  })}
main()

Now you're ready to make a tasks app!

New and Improved Docs

Ditto has a new documentation site at https://docs.ditto.live. This legacy site is preserved for historical reference, but its content is not guaranteed to be up to date or accurate.