CI CD Integration Flutter + Github Full Explanation

CI/CD in Flutter refers to Continuous Integration and Continuous Delivery, which streamline the development process by automating code testing and deployment. This approach enhances collaboration, reduces integration issues, and allows for quicker iterations, ultimately improving the quality and efficiency of your app development.

What is CI/CD in Flutter?

• Continuous Integration (CI): Automates the integration of code changes from multiple contributors into a shared repository. Involves running automated tests to ensure code stability and functionality.
• Continuous Delivery (CD): Automates the release process, ensuring that any code that passes all tests can be deployed to production environments at any time. Facilitates frequent updates and improvements to the application.

Benefits of CI/CD in Flutter Development

• Faster Feedback Cycle: Automated tests run on every commit, allowing for early detection of bugs.
• Consistency Across Platforms: Ensures that the app behaves consistently on both Android and iOS, leveraging Flutter's cross-platform capabilities.
• Automated Deployment: Simplifies the release process to app stores, reducing manual errors and saving time.
• Improved Code Quality: Integrating tests into the pipeline ensures that only stable code is merged into production branches.        
• Enhanced Collaboration:

• Encourages team collaboration by integrating code changes frequently, minimizing conflicts and integration issues.
• Provides a transparent development process where all team members can see the status of builds and tests.

• Efficient Resource Management:

• Reduces the overall resource expenditure by automating builds and tests, leading to lower operational costs.
• Optimizes build times, allowing for more efficient use of development resources.

• Continuous Monitoring and Feedback:

• Automates the monitoring of application performance post-deployment, enabling teams to quickly address any issues that arise.
• Facilitates the collection of user feedback, which can be integrated into future development cycles.

HOW to IMPLEMENT CI CD IN FLUTTER AND GITHUB REPOSITORY

Setup for windows

·         setup your project on the github

·         Create .yml files

·         Setup profile token & repository secreate key

·         Avaoid on the cicd and major focus

SETUP Your project on the Github

In this case you must have to deploy your flutter project as it on the github . You follow the step of flutter project host on the github reference easily available you have got. For CI CD you have to work on the GITHUB Action tab but you don’t need to setup because by default it enble on your project, incase your project is private or someone share you then you must talk to him and enable the tab.

CREATE .YML File

This step is the Major step where you have create file to help your github CICD pipeline

 .github >  workflows  > main.yml  in your project directory (main is optional you have change according your choice)

Inside main.yml

  on:

    pull_request:

      branches:

        - main

    push:

      branches:

        - main

  name: "Build & Release"

  jobs:

    build:

      name: Build & Release

      runs-on: windows-latest

      steps:

        - uses: actions/checkout@v3

        - uses: actions/setup-java@v3

          with:

            distribution: 'zulu'

            java-version: '17'

        - uses: subosito/flutter-action@v2

          with:

            channel: 'stable'

            architecture: x64

        - run: flutter build apk --release

        # --split-per-abi

        # - run: |

        #     flutter build ios --no-codesign

        #     cd build/ios/iphoneos

        #     mkdir Payload

        #     cd Payload

        #     ln -s ../Runner.app

        #     cd ..

        #     zip -r app.ipa Payload

        - name: Push to Releases

          uses: ncipollo/release-action@v1

          with:

            artifacts: "build/app/outputs/apk/release/*.apk"

            tag: v1.0.${{ github.run_number }}

            token: ${{ secrets.TOKENN }}

On the top of the file is very sensitive (space / name / alignment/ any minimal change provide error ) and it setup for debug application and windows setup system.

For macos change runs-on: macos-latest and artifacts: "build/app/outputs/apk/release/*,build/ios/iphoneos/app.ipa"

And token: ${{ secrets.TOKEN }}  inside TOKEN is exact name of the repository secreate key (describe on the bellow)

We have to comment ios create build app you have to uncomment for the IOS build app

In the java version make sure use as your install java version which required accordingle to flutter project which used.

Summary of the Workflow

• Trigger Events: The workflow runs on: Pull requests to the main branch. Pushes to the main branch.
• Workflow Name: "Build & Release"
• Jobs: Build Job: Name: Build & Release Environment: Runs on the latest Windows environment (windows-latest). Steps: Checkout Code: Uses actions/checkout@v3 to pull the repository code. Setup Java: Uses actions/setup-java@v3 to set up Java 17 with the Zulu distribution. Setup Flutter: Uses subosito/flutter-action@v2 to set up the Flutter environment on the stable channel with x64 architecture. Build APK: Runs the command flutter build apk --release to build the release version of the Android APK. Push to Releases: Uses ncipollo/release-action@v1 to upload the generated APK to the GitHub Releases section. The release is tagged with v1.0.${{ github.run_number }}, where ${{ github.run_number }} is a unique number for each run of the workflow. The token for authentication is retrieved from the repository secrets (${{ secrets.TOKENN }}).

Key Points

• The workflow automates the process of building a Flutter application and releasing the APK to GitHub Releases.
• It ensures that the application is built in a consistent environment and can be easily deployed after each change to the main branch.
• The commented-out sections indicate potential additional steps for building an iOS version of the app, which are currently not active.

 Prepare for the Play Store release

in this you have to create your jks file and other setup accordingle to flutter release rule. If you use there CICD  pipe you must follow the step after setup your release and securely create a release APK/APPbundle on the terminal by type flutter build appbundle.

• You have to add key.properties and setting.gradle file
• Create file on github my-upload-key.jks.base64  (.jks file convert of base64 string to paste on the file)
• in this case you have to create ANDROID_KEYSTORE_BASE64, ANDROID_KEY_ALIAS, ANDROID_KEY_PASSWORD, ANDROID_KEY_PROPERTIES, ANDROID_STORE_PASSWORD reopository secreate key  with the value as it is of the key.properties but base64 string on the ANDROID_KEYSTORE_BASE64 repository secreate key

[Convert]::ToBase64String([System.IO.File]::ReadAllBytes("upload-key.jks")) | Out-File -FilePath "upload-key-base64.txt" -Encoding ASCII

on:

  pull_request:

    branches:

      - main

  push:

    branches:

      - main

name: "Build & Release"

jobs:

  build:

    name: Build & Release

    runs-on: windows-latest

    steps:

      - uses: actions/checkout@v3

      - uses: actions/setup-java@v3

        with:

          distribution: 'zulu'

          java-version: '17'

      - uses: subosito/flutter-action@v2

        with:

          channel: 'stable'

          architecture: x64

      - name: Get Flutter dependencies

        run: flutter pub get

      - name: Decode Keystore

        env:

           ENCODED_KEYSTORE: ${{ secrets.ANDROID_KEYSTORE_BASE64 }}

        run: |

            echo "$ENCODED_KEYSTORE" | base64 --decode --ignore-garbage > android/app/upload-keystore.jks

            # You might need to adjust the path if your JKS file is not directly in android/app

      - run: flutter build apk --release --split-per-abi

        env:

           MYAPP_UPLOAD_STORE_FILE: android/app/upload-keystore.jks

           MYAPP_UPLOAD_KEY_ALIAS: ${{ secrets.ANDROID_KEY_ALIAS }}

           MYAPP_UPLOAD_KEY_PASSWORD: ${{ secrets.ANDROID_KEY_PASSWORD }}

           MYAPP_UPLOAD_STORE_PASSWORD: ${{ secrets.ANDROID_STORE_PASSWORD }}

      # - run: |

      #     flutter build ios --no-codesign

      #     cd build/ios/iphoneos

      #     mkdir Payload

      #     cd Payload

      #     ln -s ../Runner.app

      #     cd ..

      #     zip -r app.ipa Payload

      # - name: Push to Releases

      #   uses: ncipollo/release-action@v1

      #   with:

      #     artifacts: "build/app/outputs/apk/release/*,build/ios/iphoneos/app.ipa"

      #     tag: v1.0.${{ github.run_number }}

      #     token: ${{ secrets.ODIACALENDAR }}

      - name: Upload APK artifact

        uses: actions/upload-artifact@v4

        with:

          name: app-release-apk

          path: build/app/outputs/flutter-apk/*.apk

# push to master, main, develop

# pull request on main master

In this code I have to comment IOS build if you need then you oncomment and notice some of the point is

·         env  MYAPP_UPLOAD_STORE_FILE: android/app/upload-keystore.   ,   echo "$ENCODED_KEYSTORE" | base64 --decode --ignore-garbage > android/app/upload-keystore.jks   here (android/app/upload-keystore.jks    file location as it your specific location)

·         MYAPP_UPLOAD_KEY_ALIAS same name as it the build.gradle setup

    signingConfigs {

          release {

            if (project.hasProperty('MYAPP_UPLOAD_STORE_FILE')) {

                storeFile file(MYAPP_UPLOAD_STORE_FILE)

                storePassword MYAPP_UPLOAD_STORE_PASSWORD

                keyAlias MYAPP_UPLOAD_KEY_ALIAS

                keyPassword MYAPP_UPLOAD_KEY_PASSWORD

            }else{

                keyAlias keystoreProperties['keyAlias']

                keyPassword keystoreProperties['keyPassword']

                storeFile keystoreProperties['storeFile'] ? file(keystoreProperties['storeFile']) : null

                storePassword keystoreProperties['storePassword']

            }

          }

      }

Setup profile token & repository secreate key

In this personal acess token   you have to to the profile icon > setting > developer setting > personal acess Token > Token Clasic  >Generate new token > generate Token Clasic

After going to this you have to give your token name and choose repo option and other don’t need to check  then create token.

Now creating for the  Repository secreate Go to project Repository >   setting >  secreate and variables > choose action > mnew Repository Secreate Button

In this give your name of the Repository secreate and the value give the personal accesses token 

When you create Base64  Repository key you provide the value of base64 test and accordingle KeyAllias for key.properties keyallias  respectively

Avaoid on the cicd and major focus

1.      Avoid use personal acess token with or without comment it create github push error

2.      For Macos push for CICD follow the complete step as of the Macos we discoss briefly on the used area

3.      .yml file is very sensitive make changes very carefully

4.      Make sure used of the token inside .yml file is exact match to the repository_secreate