CODEMAGIC — FLUTTER CI/CD

Chema Rubio
Flutter Community
Published in
5 min readFeb 12, 2019

If Flutter already caught your attention and you’ve already started playing with it, the name of Codemagic is probably something that may sound familiar. It is the first CI/CD tool dedicated to Flutter apps, and it is developed by Nevercode. It was launched at Flutter Live in December 2018, this new tool makes easy to automate the process of CI/CD for Flutter apps from a single automation.

In this series of articles, I will focus on using Codemagic to show its performance while developing a Flutter application. Everything will start from scratch, willing to end up publishing a Flutter application in both iOS and Android platforms. Continuous integration and continuous delivery concepts may be reviewed in depth along the series.

So… where to start ? Probably no better place than other from here.

SETTINGS

Let´s focus, once Codemagic registration is finished, all repositories are presented in a smooth and beautiful Dashboard.

User Settings section provides a couple of features that are worth to be highlighted:

THEME CUSTOMIZATION

Light and Dark theme support was recently added, now users may select between both themes to be applied.

‘Accidentally felt in love with the light theme ^^’.

light/dark theme

INTEGRATIONS

Couple integrations are already available, interesting thing here could be how configuring Bitbucket, Github and GitLab integrations using the same account. In this articles, Github and Slack integrations will be used.

available integrations

TIP: Codemagic RightSide menu reveals some important tips that might be reviewed. It also contain features such as deleting applications, duplicating workflows… and so on.

Codemagic configuration tips

CONFIGURE WORKFLOW

Inside Applications section, selecting configuration wheel will present a screen in which workflow may be customized in order to tailor a delivery pipeline. Default workflow provided is pretty flexible and allows modifications on several features in each workflow step. Furthermore, pre and post stage shell scripting execution are also supported, enabling custom integrations.

default provided workflow

First idea is having the code tested, built, generate artifacts that can be installed in physical devices and get feedback about the process through an email or a Slack message. This flow should be executed each time some changes are pushed to the repository.

BUILD TRIGGERING: In this case, Select which branches to build even using patterns and if build will be triggered manually or in every push for the selected branches.

TEST: This phase provides features that allow selecting a test target, this stage may be used as a blocking one since it is available to stop builds when tests are failing even if build is passing.

BUILD: Specify how Codemagic will build some specific application. Select the mode and build arguments the application will be built for both android and iOS, this section empowers flexibility since different workflows may provide different build configuration artifacts (debug — release) depending on what branch changes are being updated.

PUBLISH: Set up code signing and configure the services you want to use for receiving build notifications and publishing the app.

Here comes the killer feature:

(」゜ロ゜)」: No mac is needed to publish iOS applications ! More information about this topic here.

This feature will be reviewed more deeply by the time team releases for both platforms begin.

START BUILDING

Starting with a Flutter sample application, in a pair of commits, first successful build just took about five minutes since the build started and the time the resultant debug mode application was installed in a physical device.

successful build result

All builds historic will be available, the detail view inside each build provides useful information revealing what steps where executed correctly and what weren’t. To be more specific, any possible problem since the environment starts to be provisioned until the publishing process is finished will be registered here.

Explanations are quite descriptive, and stack traces provided are also well-known. This makes easier when trying to identify what went wrong, failed builds will be most important scenarios when developing.

Test stage fails, run fails

Blame — You Broke The Build !!

FEEDBACK

Provided feedback using email and Slack channels is also a powerful feature, information delivery supports different workflow stages to be provided. This leads to scenarios in which specific information will arrive by the time the build is starting and another specific message for the time the build ends.

This information is provided in a beautiful format and almost instantly, generated artifacts are also provided to be installed in physical devices so they can be tested when builds succeed.

email and slack feedback examples

TEAM MANAGEMENT

Just been released ! This new BIG feature allows managing teams, just create a new team and start sharing applications and integration among team members ! As simple as that !

All members involved will get an email invitation so they can start collaborating to the shared applications.

This feature will be reviewed more deeply by the time team collaborations begin.

TO SUM UP

First approach about how easy is configuring and start building using Codemagic is shown in this article. Further articles will provide more complex content about Codemagic usage related to the application being developed to serve as a “sparring app”.

Inside Requests and Releases section, community requests are making an impact and are being taken care of in order to both upgrade the tool with better features and fill the users needs. This leads to a positive evolution of the tool focusing on real needs.

Having all this support, all this automated work ready to be triggered, and all generated valuable reports each time some changes are pushed into the repository… really sparks me joy ^^

NEXT STEPS

  • Continue application development
  • Define specific workflows for different branches (MASTER /DEV).
  • Implement custom scripting — Maybe HockeyApp artifact deployment.
  • Provide specific Android and iOS information for publishing.
  • Manage created team along the development to start collaborations !

All images provided are screenshots from

tool.

--

--