9

Quick Start Guide

Before you can take advantage of our SDK, you need to install and initialize the SDK.

Setup process overview

Flutter lets you build native mobile apps using Dart. Our Flutter SDK helps you integrate Customer.io to identify people, track their activity, and send both push notifications and in-app messages.

1. Install and initialize the SDK.
2. Identify and Track
3. Push Notifications
4. In-App

1. Install the SDK

1. In your project folder install the customer_io package:

   flutter pub add customer_io
   

   This adds a line to your package’s pubspec.yaml

   dependencies:
      customer_io: ^2.2.0
   

2. Set up your project to support iOS and/or Android:

   iOS

   iOS

   1. In your terminal, run pod install --repo-update --project-directory=ios. This adds the required iOS dependencies to your project. When the process is complete, you’ll see a message like this: Pod installation complete! There are X dependencies from the Podfile and Y total pods installed.

   Android

   Android

   1. Go to the Android subfolder and include google-services-plugin by adding the following lines to the project-level android/build.gradle file:

      buildscript {
         repositories {
            // Add this line if it isn't already in your build file:
            google()  // Google's Maven repository
         }
      
         dependencies {
            // Add this line:
            classpath 'com.google.gms:google-services:<version-here>'  // Google Services plugin
         }
      }
      
      allprojects {
         repositories {
            // Add this line if it isn't already in your build file:
            google()  // Google's Maven repository
         }
      }
      

   2. Add the following line to android/app/build.gradle:

      apply plugin: 'com.google.gms.google-services'  // Google Services plugin
      

   3. Download google-services.json from your Firebase project and copy the file to android/app/google-services.json.

3. Initialize the SDK:

   1. Add your CDP API key and site ID to your configuration.

      • CDP API Key: You’ll find this key in your Flutter connection.
      • Site ID: You’ll find this value in your workspace under > Workspace Settings > API and webhook credentials.

   2. Initialize the SDK in your app. In your main.dart file—or wherever you want to initialize the CustomerIO plugin—add the code below:

       import 'package:customer_io/customer_io.dart';
       import 'package:customer_io/customer_io_config.dart';
       import 'package:customer_io/customer_io_enums.dart';
      
      
       await CustomerIO.initialize(
        config: CustomerIOConfig(
          cdpApiKey: 'cdpApiKey',
          region: Region.us,
          inAppConfig: InAppConfig(siteId: 'siteId'),
        ),
      );
      

   3. Run your application to ensure everything is set up correctly.

2. Identify and Track

1. Identify a user in your app using the CustomerIO.identify method. You must identify a user before you can send push notifications and personalized in-app messages.

   CustomerIO.instance.identify(userId: email, traits: {
   "name": user.displayName,
   "email": user.email,
   "age": user.age,
   });
   

2. Track a custom event using the CustomerIO.track method. Events help you trigger personalized campaigns and track user activity.

   CustomerIO.instance.track(name: "add-to-cart", properties: {"product": "shoes", "price": "29.99"});
   

3. Track screen views to trigger in-app messages associated with specific screens.

   CustomerIO.instance.screen(title: "screen-name", properties: {"property": "value"});
   

3. Push Notifications

4. In-App

1. To enable in-app messaging, all you need to do is add your site ID. Remember, you’ll find your site ID under Data & Integrations > Integrations > Customer.io API: Track in the Connections tab.

2. Ensure that the SDK is initialized with the site ID in your app. You can call the initialize method from your components or services:

    import 'package:customer_io/customer_io.dart';
    import 'package:customer_io/customer_io_config.dart';
    import 'package:customer_io/customer_io_enums.dart';
   
   
    await CustomerIO.initialize(
    config: CustomerIOConfig(
        cdpApiKey: 'cdpApiKey',
        region: Region.us,
        inAppConfig: InAppConfig(siteId: 'siteId'),
        pushConfig: PushConfig(
        android: PushConfigAndroid(
            pushClickBehavior:
            PushClickBehaviorAndroid.activityPreventRestart,
        ),
        ),
    ),
    );