Bitrise- Getting started with Flutter Integration Part-1

Meet Janani
Simform Engineering
6 min readApr 19, 2021

Why we should choose Bitrise?

Bitrise is a platform as a service with the main focus on mobile app deployment. It has a lot of plugins that we can use to customize our CI/CD build flow. It supports not only native but also hybrid code such as flutter, react native, and ionic which gives us the ability to have a full team or organization support on Bitrise.

While implementing the flutter app on Bitrise, I had faced issues because the official documentation does not provide a step-by-step implementation. Also, there are no helpful articles on setting up the flutter app in Bitrise. I tried lots of things. And finally, I came up with this solution.

In this tutorial, we’ll walk you through the complete step by step workflow configuration for the Flutter app to Bitrise with the in-details explanation.

Let’s start with how to set up a flutter application with Bitrise.

Initialize Bitrise CI

Please add your flutter application in Bitrise using the below article link: Getting started with Android Integration Part-1

PS: This article is for setting up an android application though we also have to follow these instructions only to set up the flutter application.

After completing the project setup, you can check the default workflow looks like below.

Steps for workflow

We are moving with the primary workflow here. We can add more steps inside the default workflow to generate the build.

Order of the Steps matter! (From the official doc.)

Step 1: Bitrise.io Cache:Pull, Bitrise.io Cache:Push

  • To cache Memory, keep the Bitrise.io Cache:Pull step as the first and the Bitrise.io Cache:Push Step as the very last step in your Workflow!

Step 2: Certificate & PodFile Installer

Step: Certificate & PodFile Installer

Step 3: Flutter Install

  • The Flutter Install step will take care of installing the missing Flutter SDK components that your project might be lacking.
Step: Flutter Install

Step 4: Flutter

  • After Flutter Install step, in this step, we have to choose the Flutter version and along with it, we can run multiple flutters commands. by separating ‘|’ like [ packages get | packages pub run build_runner build ].
  • If we use build runner then only we have to add a second command to generate code. otherwise no need to add.
Step: Flutter

Step 5: Flutter Analyze

  • Then after add Flutter Analyze step. in this step you have to select project location with Bitrise variable like [$BITRISE_FLUTTER_PROJECT_LOCATION ] from environment variables.
  • BITRISE_FLUTTER_PROJECT_LOCATION: It is an environment variable. You can change it from Environment Variable Tab. Its default value is your root directory name. In case it does not work, set the value ‘.’(Dot) as a path of your project.
Step: Flutter Analyze

Step 6: Set Xcode Build Number

  • Add step: Set Xcode Build Number if you want to build for iOS or both. To generate build number please assign CFBundleVersion value into a build number field.
Step: Set Xcode Build Number

Step 7: Flutter Build

  • To build a flutter app, Flutter Build step is required. In this step, we need to assign values in the below variables.
Step: Flutter Build
  • PlatForm: [android, iOS, both] (select any as per use case) we can add mode as a prefix in command like (release, debug).
Step: Flutter Build Android Platform
Step: Flutter Build IOS Platform
  • Android/IOS Additional Params : [“-t lib/main.dart”] (path to the main file )

Step 8: Xcode Archive & Export

  • For iOS or both add step: Xcode Archive & Export
  • For generating IPA file we have many options like (app-store, ad-hoc, development, enterprise) we have to select based on use cases.
Step: Xcode Archive and Export for IOS

Step 9: Deploy to iTunes connect

  • For iOS or both add step: Deploy to iTunes connect
  • Before configuring this step please make sure we have to add below Code Sign-in configurations files like (Provisioning Profile for Development & App Store along with Code Sign In Certificates like Development & Distribution)
  • As we know AppStore has 2FA enabled so, to bypass that 2FA and upload a build over AppStore we have to generate application specific password first. Then provide details like AppleID, Password, Application Specific Password in Bitrise. These details are sensitive hence we need to add these details in form of Secrets variables.
Step: Deploy to iTunes connect

Step 10: Deploy Android App

  • We have many options to deploy an android mobile application like AppCenter, Firebase, PlayStore, Bitrise etc. Here we have covered AppCenter & Bitrise for the app deployment process. You can choose any option to deploy android app.

AppCenter Android Deploy

  • For uploading and sharing an android build, we are using AppCenter. For that purpose here we added the AppCenter Android Deploy step. In this step we have to generate and configure an AppCenter token then after AppCenter account details like [Owner Name, App Name, Distribution Group]. That’s it. Now, we will be able to publish our android build over AppCenter. Also, we can use it for testing purposes.

Deploy To Bitrise IO

  • After Fluter Build successfully runs our build is generated, to deploy that generate build you have to Add Deploy To Bitrise IO Step, in this step have to select Deploy directory or file path variable with Bitrise Variable like [$BITRISE_DEPLOY_DIR]
Step: Deploy to Bitrise IO

Here is the complete workflow yml file:

  • Bitrise will build your project and it will show the result on the dashboard, if it fails anywhere due to the lint then you have to fix it first.
  • I hope you can complete your Bitrise Workflow configuration using this blogpost.

What’s next?

In “Part-2,” we will be thinking of covering the workflow configuration with project flavors. As in most cases, we use different flavors in our project. Stay Tuned with us for more updates.🙂

Hope you have enjoyed reading this as much as I enjoyed writing it.
Do you think this tutorial will be of help to someone? Do not hesitate to share. If you liked it, smash the clap below so other people will see this here on Medium.

--

--