Flutter

Install Parse SDK on Flutter project

Introduction

In this guide you will learn how to get started with Back4App for your Flutter project using the Flutter plugin for Parse Server.

Prerequisites

To complete this tutorial, you will need:

Step 1 - Creating a new Flutter project

Open the cmd or terminal (depending on your operating system) and create your new project:

flutter create flutter_parse

Check if everything is OK Running the application:

cd flutter_parse
flutter run

Step 2 - Installing Flutter plugin for Parse Server

You will add the Parse to the project dependencies. Go to pubspec.yaml and add the following:

dependencies:
  parse_server_sdk_flutter: ^latest_version

Run the pub get command to install the dependencies in the project.

Step 3 - Setting up Parse SDK

Import package

In your Dart Code, clean all main.dart code and start a new one importing the Parse SDK.

In main.dart, you can use:

1
import 'package:parse_server_sdk_flutter/parse_server_sdk.dart';

Initialize your Parse app

After adding the library to your project, let’s now initialize Parse. Go to main.dart, and add the following code:

1
2
3
4
5
6
7
8
9
void main() async {
  final keyApplicationId = 'xxxxxx';
  final keyClientKey = 'xxxxxx';
  final keyParseServerUrl = 'https://parseapi.back4app.com';

  await Parse().initialize(keyApplicationId, keyParseServerUrl,
      clientKey: keyClientKey, autoSendSessionId: true);

}

To allow the application to securely connect to the Back4App servers, you must provide the Parse SDK with the application credentials.

The connection requires updating the string values with your Application Id, Client key, and Server URL.

  1. Locate your Application Id and Client Key credentials navigating to your app Dashboard at Back4App Website.

  2. Log in and click on My Apps. Find your app and then click on SERVER SETTINGS.

  3. Find the Core Settings block and click on ```Settings``. The “Core Settings” block looks like this:

  4. After that, you will see the details of your Parse app, such as your App Id and your Client Key.

Copy these credentials and replace in main.dart.

  • keyApplicationId = App Id
  • keyClientKey = Client Key

Step 4 - Test your connection

You can test the SDK to verify that Parse is working with this application.

Let’s add the test code to main as follows:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
void main() async {
  final keyApplicationId = '1ZhM7lA2ChzpOMVyXDHpxxJEHfuY4WjjF3IWKkXx';
  final keyClientKey = 'XauZ062plqH7sNPyRLIXvH41cfwuXhIqbAN2aHwe';
  final keyParseServerUrl = 'https://parseapi.back4app.com';

  await Parse().initialize(keyApplicationId, keyParseServerUrl,
      clientKey: keyClientKey, autoSendSessionId: true);

  var firstObject = ParseObject('FirstClass')
    ..set(
        'message', 'Hey ! First message from Flutter. Parse is now connected');
  await firstObject.save();
  
  print('done');
  
}

Launch your app and go to Back4App Website and click on My Apps. Find your app and then click on DASHBOARD.

Now click on Core > Browser > First Class. You should see the First Class with an object, as shown in the image below.

It’s done!

We completed the section! Now you have learned how to install the Parse SDK in your Flutter Application and connect to Back4App.