Flutter CI with Bitrise

nhancvLeave a Comment on Flutter CI with Bitrise

Hi friends, 

Today, I share my experience about how to distribute mobile build to a client via CI. 

Why Bitrise? 

I used App center, Jenkins before moving to Bitrise. App center quite slow and limit build time, I get failed with some ios build with heavy libraries (Ex: firebase set). Jenkins is good, but it requires setup on your server, it better for the company. 

Bitrise seems to be a good choice for individual developers. It’s free to build Android and iOS with the Hobby tier.

Create a new Bitrise account here: https://app.bitrise.io/referral/b53accca0fe2d177

Note for getting started: 

  • Please use my Flutter nft template which has config script included, after running successfully you can change yourself

https://github.com/nhancv/nft

Now follow my steps

  • Complete initial steps. It’s quite simple, let try it. 

Select your account -> Private -> https://github.com/nhancv/nft -> Choose public access -> release branch -> Project Flutter -> Run test: yes -> ipa export ad-hoc -> Skip app icon -> Finish

Actually, we choose a default configuration to skip the initial setup, can change the config then.

After finish the initial setup, Bitrise will auto trigger the first build -> just click “Abort” -> Abort 

  • Config app

Open project configuration by click to project link

Select Settings tab to change a default branch/project name, ….

Select Workflow tab to config build steps

The Workflow config can be changed via either UI or bitrise.yml

Android config

Do the above steps to create a new Flutter Bitrise project, change the project title to ad_nft (nft is the project name, ad_ is the prefix for the Android build)

Back to Workflows tab with UI: The steps will be auto-generated by the script: 

- Active SSH key to access repo 
- Git clone source code
- Custom script: Parse and read VERSION and CHANGELOG content from CHANGELOG.md file(https://github.com/nhancv/nft/blob/master/CHANGELOG.md) If you use another template, please consider update the parsing script
- Flutter install with auto pull the latest stable version
- Pull Bitrise cache is it exists (save time in the next build)
- Flutter analyze
- Flutter test
- Flutter build android
- Deploy android build to AppCenter (Because Appcenter quite good in management distribution with user management) (*)
- Deploy android build to Bitrise (It's optional, to view test report the build must on Bitrise)
- Send message to Slack (*)
- Push cache to Bitrise for the next build.
  • You can delete some steps which you don’t like. 🙂
  • Almost config is done, but you need to do some extra steps for AppCenter and Slack

AppCenter

  • Create a new account here: https://appcenter.ms/
  • Create a new project. Android: Java/Kotlin; iOS: Objective-C/Swift
  • Config Distribute
  • Share the public link to the client 
  • Link to Bitrise

Create App Center token: AppCenter -> App -> Settings -> App API token -> New API token

Bitrise -> Project -> Workflow -> 

  1. Workflows tab -> AppCenter Android Deploy step: update owner name, app name, distribution group name

2. Secrets tab -> Add APP_CENTER_TOKEN key with value = App API token created in the above step

Slack

https://blog.bitrise.io/slack-away
  • Register Slack webhook: https://YOURTEAMNAME.slack.com/apps/new/A0F7XDUAZ-incoming-webhooks
  • Link to Bitrise 

Bitrise -> Project -> Workflow ->

  1. Workflows tab -> Send a Slack message step: update slack channel

2. Secrets tab -> Add SLACK_HOOK_URL key with value = Slack hook URL created in the above step (look like this: https://hooks.slack.com/services/your/really/secure_token)

Trigger build

Select Project -> Start/Schedule a Build

Update branch, Workflow to primary -> Start Build

iOS config

Do the above steps to create a new Flutter Bitrise project, change the project title to ios_nft (nft is the project name, ios_ is the prefix for the iOS build)

  • Back to Workflows tab with UI: The steps will be auto-generated by the script:
- Active SSH key to access repo 
- Git clone source code
- Custom script: Parse and read VERSION and CHANGELOG content from CHANGELOG.md file(https://github.com/nhancv/nft/blob/master/CHANGELOG.md) If you use another template, please consider update the parsing script
- Flutter install with auto pull the latest stable version
- Pull Bitrise cache is it exists (save time in the next build)
- Flutter analyze
- Flutter test
- Flutter build ios
- Certificate and profile installer (*)
- Xcode Archive & Export for iOS (build ipa file)
- Deploy to iTunes Connect - Application Loader (Upload build to AppStoreConnect, TestFlight) (*)
- Deploy iOS build to AppCenter (Incase ad-hoc build type. Can remove this step for app-store type) (*)
- Deploy iOS build to Bitrise (It's optional, to view test report the build must on Bitrise)
- Send message to Slack (*)
- Push cache to Bitrise for the next build.
  • You can delete some steps which you don’t like. 🙂
  • Almost config is done, but you need to do some extra steps for Certificate and profile installer, Uploading build to AppStoreConnect, AppCenter, and Slack

Certificate and profile installer

  • Get apple signing certificate files: 
  1. Open keychain.app -> Create private key *.certSigningRequest (Keychain Access menu -> Certificate Assistant > Request a Certificate from a Certificate Authority)

2. Login to http://developers.apple.com

3. Create certificate -> download .cer -> Open to keychain.app -> Select certificate -> Export to .p12

4. Create app identifier, provisioning profile -> download to local

  • Link to Bitrise:

Bitrise -> Project -> Workflow -> Code Signing tab: Upload provisioning profile and Code Signing Certificates

  • Config on ios source code:
  1. You should create a new release branch for the release config
  2. Open <project>/ios/Runner.xcworkspace -> Runner -> Signing & Capabilities: Make sure to uncheck “Automatically manage signing”, the Provisioning Profile and Signing Certificate must be matched with Bitrise

Uploading build to AppStoreConnect

  • Create apple app password: Login https://appleid.apple.com/ -> Generate Password under “APP-SPECIFIC PASSWORDS” of Security section
  • Link to Bitrise

Bitrise -> Project -> Workflow -> Secrets tab: Add new apple credential APPLE_EMAIL and APPLE_APP_PASSWORD

AppCenter, and Slack: do the same with Android config. 

DONE!

Build status to slack

Trigger Bitrise build from mobile

  • Generate Bitrise token: Avatar -> Account settings
  • Scroll to the bottom and select Security 
  • Generate new personal access token
  • Download mobile app NBitrise: 

https://apps.apple.com/vn/app/nbitrise/id1537309969

https://play.google.com/store/apps/details?id=com.nhancv.nbitrise

  • Paste the Bitrise token to NBitrise then trigger build. That’s it.

@nhancv

Leave a Reply

Your email address will not be published.Required fields are marked *