Automate Building Your Flutter App with Jenkins (Part -1)

Automate Building Your Flutter App with Jenkins (Part -1)

As a Software Engineer, I keep learning new things every day and this time, I started my journey of learning DevOps with Jenkins.

Objective

In this article, we will create an integration of your Flutter application with Jenkins and create a pipeline script to remotely trigger a build for your Flutter application.

Before you move further, there are some prerequisites that you must have if you're considering creating a Jenkins Pipeline of Your own.

Prerequisites

  1. Jenkins Server Installed on your PC.(https://www.jenkins.io/doc/book/installing/windows/)

  2. Flutter Project

  3. GitHub Account

  4. Java installed on your system

So, your first question might be, What is Jenkins if you're not familiar with it and why should we use it for building our flutter application?

What is Jenkins?

In layman's definition, Jenkins is an automation tool that can reduce your manual work of building and deploying your application. It helps you smoothen the process of development and deployment so that software developers in the project can only focus on their work of developing flutter code. There is so much else you can do with Jenkins like merging your branches, testing your application on different branches etc. Any repetitive task you do manually during the software development process can be automated with Jenkins.

Why use Jenkins for Flutter CI/CD Integration?

  1. It is Free to Use.

  2. Very Flexible - Integrates with almost everything through its extensive plugin ecosystem.

Set up Environment

Open Your Jenkins Dashboard Page. Navigate to "Manage Jenkins" >> "System". Scroll down to find the "Global Properties" section.

Create 3 new Environment variables to integrate Jenkins with Android SDK, Flutter and JAVA.

  1. ANDROID_SDK_ROOT = C:\Users\username\AppData\Local\Android\Sdk (default location for Android SDK if you have installed it using Android Studio)

  2. FLUTTER and Git - Ex:

    PATH = "C:\src\flutter\bin;C:\Program Files\Git\bin;${env.PATH}"

  3. JAVA_HOME = C:\ProgramFiles\Java-11

    This Path variable will overwrite your Local system's PATH variable.

    If you have git installed on your system already then you can configure the location for git in Jenkins through the PATH variable.

Integrate Jenkins With GitHub Using SSH Key

Open git bash and type "ssh-keygen". You will generate two files in the .ssh folder. One is id_rsa which is the private key and the other file is id_rsa.pub. The location for the .ssh folder will be C:\Users\your_username\.ssh. The file that contains the public key will be stored in your GitHub account and the private key will be stored in Jenkins.

Go to Your GitHub Account. Under Setting you will find the option to add a new SSH key. Paste your key in the id_rsa.pub file here and save it.

Now go back to your Jenkins. And add a new credential at "Manage Jenkins" >> "Credentials" >> "System" >> "Global Credentials Unrestricted". Click on Add a new Credential.

You have to paste the key present in the id_rsa file in the .ssh folder here. Click on Create.

Create Pipeline

Now Navigate back to your dashboard page.

Click on "New Item". Select the option for Pipeline and provide it with a name.

Scroll down to pipeline and in the pipeline section, provide the following script

pipeline {
    stages {
        stage("Set Description for Your Builds")
        {
            steps{
                script{
                    currentBuild.displayName = "[#${BUILD_NUMBER}]"
                    currentBuild.description = "Executed on: ${NODE_NAME}\n"
                }
            }
        }
         stage('git checkout') {
            steps {
                git credentialsId: 'jenkins_connect_with_github', url: 'https://github.com/your_username/repo_name.git'
            }
        }
        stage('Update dependencies and test flutter app') {
            steps {
                bat 'flutter pub get'
                bat 'flutter test'
            }
        }
        stage('Build Flutter App') {
            steps {
                bat 'flutter build apk --debug'
            }
        } 
    }
    post {
            always {
                // Clean up Stage
                // Clean Workspace after the build is completed
                // Frees up the disk space
                 cleanWs()
            }
       } 
}

The First Stage "Set Description for your builds" is an optional one. It changes the way your list of builds appears in build history. Through this step, I have customized it to display the "Node" on which this build is executed alongside the build number.

The second Stage "git checkout" connects with my GitHub repository where flutter code is stored and clones the latest code on the master branch in Jenkins Workspace. "credentialsId" is the name you have provided in the id box while configuring your git credentials in Jenkins.

The third stage is self-explanatory. It runs the Flutter command to update dependencies and test the Flutter app.

The fourth stage creates an APK file/build artifacts for our flutter project.

The last step performs cleanup / frees up disk space and allows your Jenkins instance to perform better. This step will always be performed even if your build fails. You can also limit the number of build logs to be kept. In the General section of your pipeline configuration, you will find the option for "Discard old builds".

Output