Flutter Development Process

Introduction

This document provides an overview of the Flutter development process, including the steps involved in building a Flutter application.

Prerequisites

Before starting the Flutter development process, ensure that you have the following:

  1. Flutter SDK installed on your machine
  2. A suitable Integrated Development Environment (IDE) like Visual Studio Code

Project setup

Clone and start this project

$ git clone https://github.com/Rekindle-Learning/rekindle-flutter.git

$ flutter pub get

Generate client assets

To copy the required client assets into their path, run the copy-clientfiles script with the selected <client>.

Example to run rekindle:

Windows:

./copy-clientfiles.bat app

Mac:

./copy-clientfiles.sh app

To use a different client, simply change the app name ie. ./copy-clientfiles.sh agsa

Prepare for web

Locate the Flutter folder in your system:

  • Go to flutter\bin\cache and remove a file named: flutter_tools.stamp
  • Go to flutter\packages\flutter_tools\lib\src\web and open the file chrome.dart
  • Find '--disable-extensions', in that file
  • Add '--disable-web-security', below the previous line

Setup Firebase and FlutterFire

Make sure you have the Firebase CLI installed, otherwise run:

npm install -g firebase-tools

Next, install the FlutterFire CLI by running the following command:

dart pub global activate flutterfire_cli

Important: As the project expects to find firebase_options_production and firebase_options_staging files under /lib/firebase/ it is important to run the provided bash script. Remember to run it for staging and production for the first time.

Navigate to the project directory and run the following script to download the GoogleService-Info.plist file for the specified flavor and environment.

./create-firebase-app.sh <flavor> <environment>

Replace <flavor> with the name of your app (e.g., agsa, app, etc.) and <environment> with the environment you are testing (e.g., staging or production).

Example

To download the Firebase configuration for the agsa flavor in the staging environment, run:

./create-firebase-app.sh agsa staging

Verify that the google-services.json file has been downloaded to the appropriate directory within your Flutter project. It should be located under android/app/src/<flavor>/google-services.json.
Ensure that the Firebase configurations are correctly set up for each flavor and environment.

Running the app

We recommend to run the app using the launch.json configuration if you are using VSCode.

You can also use the following script to run the staging flutter app

flutter run --dart-define=DEFINE_ENV=staging --dart-define=DEFINE_HOST=portal.rekindleapps.com  --dart-define=DEFINE_TARGET=web --dart-define=DEFINE_SLUG=agsa

Run the flutter app pointing to the “dummy organisation” in the production app

flutter run --dart-define=DEFINE_ENV=production --dart-define=DEFINE_HOST=portal.rekindlelearning.com --dart-define=DEFINE_SLUG=crosshill

Testing

Write unit tests using the Flutter testing framework. Perform integration testing to ensure different components work together. Conduct manual testing on real devices to identify any issues.

To Run Unit Tests in Flutter:

$ flutter test

Dependencies

  • Xcode 14 is needed to run the iOS app. This is a requirement of InappWebView package, which is a dependency of the Youtube Player Iframe package we are using.
  • You will need to ensure the imagemagick library is installed by running brew install imagemagick.