JavaScript Web

you can integrate the ditto sdk with your web and node js projects developed using javascript and https //www typescriptlang org/ languages to install the javascript sdk /#prerequisites confirm that you meet the minimum requirements /#installing dependencies add the ditto package to your environment /#integrating ditto and starting sync import and initialize ditto in your app /#running ditto authenticate with the big peer and start syncing offline prerequisites following are the minimum requirements that must be met before attempting to install ditto https //nodejs org/en/ active or maintenance long term support (lts) version linux, macos version 11+, or windows version 10+ installing dependencies install the @dittolive/ditto package into your project bash npm install @dittolive/ditto integrating ditto and starting sync import and initialize ditto, and then provide your access credentials for one time authentication with the big peer from the top most scope of your app, import ditto using async/await, initialize ditto provide your access credentials by replacing the placeholders in the snippet below with values obtained from the ditto portal replace the appid placeholder value with the app id that identifies your app in ditto replace the token placeholder value with your playground token that the big peer uses to verify your digital identity before issuing your playground certificate make sure to instantiate the ditto instance in the top most scope of your app otherwise, it may be inadvertently garbage collected and no longer accessible throughout the lifecycle of your app for instructions on how to obtain your access credentials, see docid\ u214qhyymcxbv9jnamrfh for an introduction to authentication in ditto, see security > docid\ d0b4xrfn45yem15qcycob import { init, ditto } from "@dittolive/ditto"; let ditto; async function main() { await init() ditto = new ditto({ type "onlineplayground", appid "your app id", token "your playground token" }) // enable mutating dql statements and ensure you only sync with peers using version 4 0 or higher of the ditto sdk await ditto disablesyncwithv3() // initialize the sync process ditto startsync() } main() running ditto you can now run your basic snippet using node and should not see any errors bash node index js add a sync subscription add a sync subscription to receive updates on documents that match its query from connected peers in the docid\ dh0vjod2 ozvnckas9h7x use registersubscription() in the ditto sync namespace to add a sync subscription import { init, ditto } from '@dittolive/ditto' let ditto async function main () { await init() ditto = new ditto({ type "onlineplayground", appid "your app id", token "your playground token" }) // enable mutating dql statements and ensure you only sync with peers using version 4 0 or higher of the ditto sdk await ditto disablesyncwithv3() // initialize the sync process ditto startsync() // add a sync subscription ditto sync registersubscription(` select from tasks where isdeleted = false`) } main() listening to changes now that your app is ready to receive updates to documents from other peers, you might want to react to those changes as soon as they happen for this you can use the registerobserver() method on ditto store the passed in callback closure is invoked by ditto everytime it registers new changes to documents matching the query import { init, ditto } from '@dittolive/ditto' let ditto async function main () { await init() ditto = new ditto({ type "onlineplayground", appid "your app id", token "your playground token" }) // enable mutating dql statements and ensure you only sync with peers using version 4 0 or higher of the ditto sdk await ditto disablesyncwithv3() // initialize the sync process ditto startsync() // add a sync subscription ditto sync registersubscription(` select from tasks where isdeleted = false`) // add a store observer ditto store registerobserver(` select from tasks where isdeleted = false`, (result) => { console log(`tasks have been updated ${result items}`) } ) const newtask = { iscompleted false, isdeleted false, body "hello world!" } // insert a new document await ditto store execute(` insert into tasks documents (\ newtask)`, { newtask }) } main()