Mobile Application

Flutter Codemagic CI/CD: Complete Guide to Flutter Automation

Flutter Codemagic CI/CD makes your Flutter app build, test, and deployment processes easier and fast. Codemagic will enable you to optimise your development process, whereas release comes out much quicker than without much less mistakes. Integrates with GitLab, Google Play console, and App Store connect amongst others, this powerful CI/CD tool makes it easy to automate a build and deliver quality Apps. Now, let’s find out how it can be utilized to the maximum!

Prerequisites

  • GitLab Account: Ensure you have a GitLab account with repository access.
  • Google Play Console Account: Access to your Google Play Console.
  • Google Cloud Console Account: Access to the Google Cloud Console.
  • Apple Developer Account: Access to your Apple Developer account.
  • App Store Connect Account: Access to your App Store Connect account.
  • Codemagic Account: A Codemagic account is needed to configure your build pipeline.

Step 1: Create a Codemagic Account

  1. Go to Codemagic.io.
  2. Sign up using your GitHub, GitLab, or Bitbucket account.
    • Note: Ensure that your repository is associated with the selected account.
  3. Authorize Codemagic to access your repositories.

Step 2: Add Your Project to Codemagic

  1. Once logged in, click on Add application.
  2. Choose your repository provider (GitHub, GitLab, Bitbucket).
  3. Select the repository containing your Android project.
  4. Codemagic will detect the project type automatically. Ensure that the correct project settings are selected.
See also  Custom Activity Life Cycle Components for Android

Step 3: Configure Build Pipeline

  1. Choose the workflow that suits your build (e.g., Gradle) or keep it Default.
  2. Select Build for platforms like Android, iOS, etc.
  3. Build Trigger (Optional): Set the conditions under which your pipeline should trigger (e.g., push to the main branch, pull request).

Add Webhooks

Why Use Webhooks?
Webhooks in Codemagic initiate builds automatically when specific actions, like pushing code or creating merge requests, happen in your GitLab repository. This ensures your build pipeline always reflects the most recent code changes.

How to Add Webhooks:

  1. Navigate to your GitLab project.
  2. Go to Settings > Webhooks on the left sidebar.
  3. Enter the webhook URL provided by Codemagic (found in Build settings > Webhooks in Codemagic).
  4. Select the events that should trigger the webhook (e.g., Push events, Merge request events).
  5. Save the webhook configuration.

Skip Environment variables and Dependency caching for manually built push.

Testing

  • Add any testing steps if needed, such as running unit tests.

Build

  • Select Android build format and select the build mode (e.g., release, debug).

4.1 Create a Service Account in Google Cloud Console

  1. Go to Google Cloud Console.
  2. Select your Play Console project from the top and navigate to IAM & Admin > Service accounts (from the left menu).
  3. Click Create Service Account.
  4. Enter a name for the service account (e.g., codemagic-deployment).
  5. Copy the default “Email address” created by the service account.
  6. Click Create and continue to the next step.

4.2 Grant Service Account Permissions

  1. In the permissions step, click Select a role.
  2. Choose Project > Editor or Owner (Owner gives full permissions; Editor is safer).
  3. Click Continue and skip adding users.

4.3 Generate a JSON Key

  1. After creating the service account, click on it to open its details.
  2. Go to the Keys tab.
  3. Click Add Key > Create New Key.
  4. Choose JSON and click Create.
  5. A .json file will be downloaded. Keep this file secure as it contains credentials for your service account.
See also  How to Build a Voice Chat App like Clubhouse?
  1. Go to Google Play Console.
  2. Navigate to User and Permission. Go to the Users tab and click on Invite New users.
  3. Enter the service account email which we have copied previously (Step 4.1) and inside Account Permission, grant Admin permissions.
  4. Click the Invite user button.

Step 5: Distribution in Codemagic

5.1 Android Code Signing

Store Keystore Information in Codemagic

  • Generate or Locate Your Keystore File:
    If you don’t have a keystore file, you can generate one using the following command:
keytool -genkey -v -keystore your-keystore-name.jks -keyalg RSA -keysize 2048 -validity 10000 -alias yourkeyalias
  • You’ll need keystore credentials.
  • Upload the Keystore File:
    1. In Codemagic, go to your project settings.
    2. Scroll down to the Distribution > Android code signing section.
    3. Upload your your-keystore-name.jks file.
    4. Enter your keystore password.
    5. Enter your key alias.
    6. Enter your key password.

5.2 Google Play

  • Enable Google Play publishing
    1. Under the Google Play section, upload the JSON key file you generated earlier in Step 4.3.
    2. Choose the track you want to deploy to (e.g., internal, alpha, beta, production).
    3. Click on Save changes.

Add on for iOS Setup

6.1 Create a Service Key for App Store Connect

  1. Go to App Store Connect.
  2. Navigate to Users and Access > Integrations > Team Keys.
  3. Click on the “+” button to create a new key.
  4. Provide a name for the key (e.g., Codemagic CI/CD).
  5. Assign the role of Admin to the key.
  6. Click Create. This will generate a private key file (.p8).
  7. Download the .p8 file. Keep this file secure.

6.2 Gather Necessary Information for Environment Variables

  • Issuer ID: You can find this in the App Store Connect API Keys section.
  • Key ID: You will get it after creating the key.
  • Apple Developer Team ID: Get you Apple Team Id 
  • Apple ID:  email address of Developer account.
  • App-Specific Password: Generate this in your Apple ID settings under Security.

6.3 Codemagic > Distribution > iOS Code Signing

  1. Select code signing method as manual.
  2. Upload your iOS distribution certificate (.p12) and provide the password.
  3. Upload your provisioning profile that corresponds to your app’s bundle ID.
See also  The Ultimate Guide for Hotel Booking App Development

6.4 Codemagic > Distribution > App Store Connect

  1. Enable App Store Connect publishing.
  2. Select App Store Connect API key.
  3. Enable Submit to TestFlight beta review if you want to deploy to TestFlight.
  4. Enable Submit to App Store review if you want to deploy to the App Store.

Step 7: Run Your First Build

  1. After everything is configured, go back to your Codemagic dashboard.
  2. Click Start your first build.
  3. Monitor the build logs for any errors.
  4. Successful builds deploy to Google Play Console or App Store Connect

Conclusion:

Codemagic makes CI/CD process very easy for projects with Flutter and supports automatic build on various triggers and integrates well with Google Play and App Store Connect. It is used for Android/iOS code signing, running tests and managing environment variables, and it is safe. To facilitate the fault detection and the distribution of the builds the detailed logs, and easily accessible build artifacts are used. Codemagic is essentially an automation tool for the build, test, and release processes, so for Flutter developers, it is a godsend.

FAQs 

Q1: What happens if my build fails?

If your build encounters an error, Codemagic provides comprehensive logs to help you identify and resolve the issue. Common culprits include incorrect credentials, missing required dependencies, or configuration problems within your build scripts (build.gradle or Pubspec.yaml).

Q2: Can I run tests in Codemagic?

Yes, Codemagic supports running unit, integration, and UI tests as part of your build process. Within the Codemagic settings, you can configure which tests to execute and how to handle their results.

Q3: How do I manage environment variables in Codemagic?

Codemagic allows you to set environment variables in the build settings. You can use these variables in your scripts or application code during the build process.

Q4: What are build artifacts, and how can I access them?

Build artifacts are files generated during the build process, such as APKs, IPAs, or log files. Codemagic provides a way to download these artifacts directly from the build logs page.

lets start your project

Related Articles