Flutterexperts

Flutter has been out there from a long enough time and has been taking the Mobile Development Community by Storm. With the scope of Mobile Development apparently increasing ,the need to Integrate CI/CD Tools in your flutter Apps is a Must enriching the work pattern of Team. One of the prominent among Continuous Integration is Bitrise.

Continuous Integration:

Continuous Integration is the process of merging and syncing your code to one dedicated git provider and automating your build process upon performing the tests. The software development process is to make your development flow smoother and keep your code clean when working in a big team code merging often ends up in issues. Continuous integration is about making sure that every change is merged into one dedicated branch upon task completion and to get a corresponding build for the same.

CI using Bitrise:

Bitrise is cloud-driven CI/CD tool which has four major points as described by them:

Complete mobile development stack inclusion:

Bitrise promises support for both native as well as cross-platform, be it Java or Kotlin, Objective C or Swift, or Iconic, React or Flutter it got you all covered.

Code independence:

Whether you have your code on Github or on Bitbucket or on GitLab or on it’s private or public git service. It will get your code for you.

Hardware independence:

Since Bitrise is a cloud-driven tool you don’t need any specific hardware to make this work. All you’ve to do is just add your app to their dashboard and voila!

Build anytime:

Webhooks works on pull-request and every time a request is made the webhook gets triggered or makes a custom webhook or schedule your builds.

Let’s Start

Now, that we have had an idea about continuous integration and about Bitrise lets integrate Bitrise to our Flutter app.

Step 1: Setup your application

• Create a basic app or choose an already existing one.
  I am going to start with the basic demo app just to give you the idea of Bitrise integration.
• Create Flavors for your app.
  Now, I won’t go in detail about how to setup Flavors for your flutter app, for that please follow this Creating flavors of a Flutter app and Flutter Flavoring. But adding Flavors to your app is like setting it right for different build requirements. In an organization, it’s always a good practice to create flavors for your app, where you might handle different build instances for different purposes, one for Demo purposes, one for Dev, one for Staging, one for Production and every build might have different configurations, different icons, different names so with the use of flavors it gets easy to handle all these scenarios.

The above-mentioned articles will help you create flavors for your flutter app for both platforms.

Step 2: Integrate your App to Bitrise CI

Now, that you’ve created flavors for your app, you can head over to Bitrise and sign up on the website or log in if you already have an account.
Once you’re in the dashboard, click Add new application. This is where you’ll integrate your App to Bitrise after following the steps.

Now we’ll look into these steps:

• Choose Account
  Here, you choose your Bitrise account to which you want to add the app. Once you’ve chosen your account you’ll be required to select the privacy of your app, of the two options available i.e Private and Public. Private is for you and your team members while the Public is for everyone.

• Connect your repository
  Now, that you’ve selected your account and the privacy mode for your app you’re asked to select the repository for the source code of your app. There’re various options like GitHub, Bitbucket, GitLab or git URLs where the source code of your app already exists.

• Adding an SSH key to your repository
  Now, that you’ve selected your repository you may need to give it access rights to Bitrise by integrating the SSH key to the repository, this is required for Bitrise to clone your code to their virtual machines. For this, you have two options, Automatic integration or Manual integration.
  When you select the Automatic option among the two on the right top corner of the step, an auto-generated key will be registered for Bitrise and corresponding public key for your Git provider. The Manual option lets you generate your own SSH key and register them to Bitrise and to your Git provider.

• Choose the branch
  Select the branch of your repository from which the Bitrise will fetch the source code.

• Build configuration
  After selecting the branch Bitrise will clone and validate it and upon validation, Bitrise will ask you to select the build config of the app which and to select the tests if available in your app which we created while setting up the app. 
  There are two ways of doing this, Manual and Detected. In Manual mode, you can select the build configuration as per need while in Detected mode, Bitrise detects the existing config.

• Select the App icon
  Select the app icon which you want you to use for your app if you have or you can skip this step for now.
• Register a webhook
  So, you have almost added your app to Bitrise but there’s one finest and the best thing about CI’s i.e automation. I mean isn’t why we here after all? To make sure that the moment we make some changes in the code and as soon as we finish pushing the changes to the git provider Bitrise automatically tests the build and send us the build? That’s what this Webhook will do. It will keep an eye on the branch you’ve provided in the above steps for any push-requests, following which it will update its code and run the test setup by you and upon any kind of response either Build Successful or Build failure, a feedback mail to your registered mail id.
  This step is not mandatory as you can find this step later in the settings page so feel free to skip it.
• Almost DONE!
  So, if you followed all the above steps correctly, rejoice! you’re almost done. Bitrise will automatically trigger a build for you and as soon as its completed you’ll be notified about it in your mail.

Bitrise Dashboard

Once your app is added to the Bitrise an initial build will kick off automatically and the report for the following will be mailed to you by Bitrise. Now, if you check the dashboard, on the right corner you’ll find your apps added to Bitrise. On clicking on it you’ll be navigated to the detail page where you can access the app workflow, builds, code, settings, etc.

• Builds
  This will have all your build reports.
• Workflow 
  This contains the nuts and bolts of your app for Bitrise integration. You can edit or create workflows as per your requirement, you can sign your app for deployment to the play store or app store, edit/create environment variables that are used in in the flow, “bitrise.yaml” file is the config file that fetches all the configuration of your app on Bitrise.

• Team
  This will let you control your team members related to this current app/project. You can assign the Admin, Developer, Tester, all that sort of work.
• Code
  This lets you control the trigger token and webhooks for your app.

Conclusion:

I hope you got an idea about how to work with Bitrise in Flutter. Well, there are various options out there for CI and sometimes it’s not about which is best, it’s also about what you feel comfortable with. So, you’re all ready to explore further but all these tools are efficient only if your app/project is of enterprise-level when a number of people are working as a team on a common app/project and if you’re a sole developer you don’t want to go through this hassle.

flutter-devs/flutter_bitrise
A flutter demo showing use of flutter bitrise. Contribute to flutter-devs/flutter_bitrise development by creating an…github.com

---

Feel free to connect with us
And read more articles from FlutterDevs.com

FlutterDevs team of Flutter developers to build high-quality and functionally-rich apps. Hire flutter developer for your cross-platform Flutter mobile app project on an hourly or full-time basis as per your requirement! You can connect with us on Facebook, GitHub, and Twitter for any flutter related queries.