How to Setup CI/CD for Flutter Apps with GitHub Actions
Tags: Cicd, Flutter, Continuous Delivery, Flutter App Development, Continuous Integration

Some programmers claim that there is always a dilemma between building good software and writing code quickly to achieve business goals. With CI/CD (Continuous Integration/Continuous Delivery) developers are empowered to write better software and also build products faster, which is a win for everyone.

This article is a guide on implementing CI/CD with Flutter and why it’s important to integrate on your engineering team.

Theoretical side

They say you cannot please everyone, but CI/CD breaks this rule. This simple idea belongs to IT pioneer, Grady Booch. Can you imagine your colleague running from department to department with a floppy disk three times a day to introduce CI? That’s how challenging it was to implement CI in 1991. Today, things are much less complicated.

The main purpose of CI/CD is a continuous merge of working product versions into the main development branch and frequent project build execution for a discovery of potential bugs and resolution of integration problems.

The faster you find a bug, the less you pay for it. Sometimes the price is too high, like with Mariner 1 and Therac 25.

What are the benefits of CI for a business?

1. Efficient Developers

By incorporating CI, the development team becomes more bankable and the cost of your software projects decreases. CI aims at refining the integration process, thus breaking it down into simple, daily development tasks, to help minimize the build costs and detect defects early in the software lifecycle.

2. Faster Software Builds

Infrastructure and deployment are automated. Everyone loves to see the output of their work, developers especially, and the business gets to see the benefits of this code right away. Deploying a smaller patch of code is less risky when developers can take advantage of test automation, so they have less overhead and coordination with a QA team.

3. Focus on solving business problems

Dev-ops team must support pipeline development, and this helps developers to focus on solving business problems, without thinking about infrastructure deployment.

Practical side

inVerita Flutter developers are experienced in working with CI systems such as Jenkins, Circle IO, Bitrase, and Gitlab CI. Since we have a Github project code store, it’s better to integrate CI into Github rather than any other third party service.

Github Actions is a new feature of Github that enables users to create a CI/CD system directly in a Github repository. Developers and Dev-ops can write individual tasks, called actions, and combine them to create a custom workflow. It gives us the ability to build our product, rapidly test our app, and publish them. The best thing is that you can do this inside Github and avoid third-party websites.

Github private repositories usually offer a free plan of 2000 build minutes a month. We usually use 1800 build minutes a month for both middle-sized and big projects.

Now let’s talk about the steps needed for the integration of the CI/CD workflow for a Flutter app.

1) Create Github Project

For example, you have a standard Flutter Counter App.

Then add Flutter integration tests, unit tests, and widgets tests to the project.

Widgets test

Integration test (UI tests)

2) Add a workflow file

In the root folder of your Flutter project, create a new folder .github and a subfolder workflows. This is where your workflow .yml or .yaml extension files will reside (for example we provide its main.yaml)

A project can have multiple workflow files, but for simplicity, we recommend using only one file for this project.

3) Writing Commands

We’ve tried to explain every line of the file with comments. If you need more information about a syntax for Github Actions, check it out here.

Run unit and widgets tests job

We integrated CodeCov to automatically generate beautiful reports from CI.

Here’s what the reports look like:

CI report #1

CI report #2

CI report #3

Run integrated tests iOS job

Run integrated tests android job

Build and deploy job

Recommendations on how to improve workflow. We recommend adding personal notifications for developers in messengers like Slack, Telegram, or WeChat because this allows them to quickly provide some help if needed.

See the workflow and release in Github

Once you have pushed the code you can see the workflow in action by going to <repo-url>/actions .

You see the release files by going to <repo-url>/releases .

Your site will be published <yourusername>.github.io/<repo-name> . Here’s an example.

Now you have a beautiful desktop application.

The full code is here.

Useful links

Great article about running flutter driver tests on Github actions

About GitHub Actions doc

Flutter testing

Wrap Up

We believe that in many cases, CI/CD improves code quality and allows us to iterate on first-rate products quicker than other approaches.

When should we use CI/CD? We recommend using it whenever you start developing from scratch. In case you have monolithic IT systems and you’d like to integrate CI/CD into the development process, think twice, because you will have to rebuild the architecture according to the new requirements. It is more likely, you won’t benefit from CI when making improvements in your old code, but you will definitely win if you use it for a new project. If you stuck with your Flutter app development, contact inVerita.