Ditto Playground

Please open the JS console and play around with Ditto!

    // Initialize the Ditto module (loads WebAssembly, etc.):
    await Ditto.init({ webAssemblyModule: '/web/ditto.wasm' })

    // Create a Ditto context:
    const identity = { type: 'offlinePlayground', appID: 'live.ditto.playground' }
    const ditto = new Ditto.Ditto(identity, 'playground')

    // Get hold of a collection:
    const cars = ditto.store.collection('cars')

    // Insert an entry:
    const fordBlack = { _id: 'ford-black-123', model: "Ford", color: "black" }
    await cars.upsert(fordBlack)

    // Find an entry by ID:
    const foundFordBlack = await cars.findByID('ford-black-123')
    console.log(foundFordBlack)

    // Remove an entry:
    await cars.findByID('ford-black-123').remove()
  

NOTE: not all browsers support await in the console. If you try the above and get a syntax error, use promises directly instead:

    // Init the Ditto module and wait for it to finish.
    Ditto.init({ webAssemblyModule: '/web/ditto.wasm' }).then(() => {
      console.log('Ditto module initialized successfully.')
    })

    const ditto = new Ditto(identity, 'playground'))
    // ...