Codemagic ApparenceKit template setup

What is codemagic ?

codemagic is a CI/CD tool for flutter. It allows you to automatically build your app and publish it on the store. This is way easier than doing it with Gitlab CI or Github Actions as they provides a lot of preconfigured steps for flutter. Also they take care of keeping XCode, cocoa pods, android sdk, etc up to date. (Which is a pain to do manually).

It's free for open source project and you can have 500 minutes of build time for private project.

Before you start

You must have the following:

  • A codemagic account with your github or gitlab account linked
  • An Apple developer account
  • An apple created on the apple developer portal
  • A Google Play developer account
  • A Google Play application created on the Google Play console

Setup codemagic

If you want codemagic to automatically send your app to the store, you need to setup the store connection. Follow this two tutorials for Android and iOS.

Workflow

We will generate a codemagic configuration (codemagic.yaml) that will build your app and publish it on the store.
You are free to customize it as you want.
It will contain two workflows:

  • Build and publish an iOS app
  • Build and publish an Android app

They will both be triggered on a push on the master branch only.
You can also choose to do it on a tag... You work on branch and when you are ready to publish you create a tag and push it to the remote.

If you want to customize the trigger please refer to the codemagic documentation.

Generate the codemagic configuration

To generate the codemagic configuration, run the following command:

dart pub global run apparence_cli ci --provider=codemagic .

This will generate a codemagic.yaml file at the root of your project. But before that you need to setup your environment variables. 👇

Setup your environment variables

You need to setup all the variable required in environment.dart file. See the environment variable documentation.

👉 This way all the variable are available in the app at runtime.
And you don't have to store any secret in the code.

To create a new variable in codemagic, go to your project settings and click on Environment variables in the left menu. See the codemagic video

How to add or remove a variable

  1. Open the generated codemagic.yaml
  2. On the "Flutter build ipa and automatic versioning" or "Build AAB with Flutter" step, you can add or remove a variable.

All the variable are passed to the build command

- name: Flutter build ipa and automatic versioning
    script: |
        flutter build ipa --release \
        --dart-define=ENV=prod \
        --dart-define=BACKEND_URL=$BACKEND_URL \
        --dart-define=SENTRY_DSN=$SENTRY_DSN \
        --dart-define=GLASSFY_TOKEN=$GLASSFY_TOKEN \
        ...