Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.ditto.live/llms.txt

Use this file to discover all available pages before exploring further.

This content is for SDK V4. For the latest version, see the V5 documentation.

Prerequisites

Ditto’s Flutter Quickstart supports iOS, Android, and Web. Before getting started, ensure you have the following:
  • A code editor (Visual Studio Code is our recommendation, but any code editor will work)
  • Git installed on your machine
  • Flutter SDK (version 3.19.0 - 3.32+) installed on your machine
  • A Ditto Portal account with a configured Ditto Database (see Getting SDK Connection Details)
  • Android Studio installed on your machine
  • A physical Android device or Android emulator
  • A macOS machine with the latest version of Xcode (15 or later) installed
  • A physical iOS device or iOS simulator
  • Ensure you have Flutter SDK version 3.22.0 - 3.32+ installed
  • Please refer to the Flutter for Web guide for additional information on Ditto’s support for Flutter Web.

Get Started

1. Clone the Repository

  1. Open the terminal
  2. Clone the repository from GitHub.
    git clone https://github.com/getditto/quickstart
    
  3. Navigate to the project directory:
    cd quickstart
    

2. Configure Ditto

Get Ditto Database ID, Playground Token, Auth URL, and Websocket URL

Update Flutter Application with Ditto Credentials

  1. Open the lib/main.dart file or the appropriate configuration file where Ditto is initialized
  2. Update the code with the Database ID and Playground Token from your Ditto Database
Dart
const appID = "REPLACE_ME_WITH_YOUR_APP_ID";
const token = "REPLACE_ME_WITH_YOUR_PLAYGROUND_TOKEN";
const authURL = "REPLACE_ME_WITH_YOUR_AUTH_URL";
const websocketURL = "REPLACE_ME_WITH_YOUR_WEBSOCKET_URL";

3. Run the Application

  1. Navigate to the Flutter demo directory.
    cd flutter_app
    
  2. Install the necessary dependencies. This fetches all required packages from pubspec.yaml.
    flutter pub get
    
  3. Run the Application
    flutter run
    
  1. Ensure you have an Android Emulator running or connect a physical device
  2. Select the Android Emulator/Device
    \[1]: sdk gphone64 arm64 (emulator-1234)
    \[2]: Mac Designed for iPad (mac-designed-for-ipad)
    
    **Please choose one (or "q" to quit):** 1
    
  1. Ensure you have an iOS Simulator running or connect a physical iOS device
  2. Select the iOS Simulator/Device
    \[1]: iPhone 15 (5A8DFE9D-7BF0-4BEE-A675-A056B64CEE3F)
    \[2]: Mac Designed for iPad (mac-designed-for-ipad)
    
    **Please choose one (or "q" to quit):** 1
    
  1. Ensure you have Google Chrome installed
  2. Run the application in the web browser
    flutter run -d chrome
    

4. Sync-Data Offline

Please note that the web platform only supports syncing data with the Ditto cloud and does not support peer-to-peer sync

Next Steps

All the Ditto Quickstart apps works together! Try running a quickstart app in other languages and see them all collaborate.

Additional Resources