Set up CI/CD for Flutter Application (CodeMagic)
How would you feel when I say- You only focus on your flutter development by writing quality code, while some magic tool takes care of the rest i.e. running all the tests, making both android and ios builds, deploying it to the Play and Apple Store, and even sharing it with your colleagues on Slack. Interesting? 😲
Let me introduce you to the magic tool named, Code Magic!
All you have to do is to push the code to the git repository, while CI/CD does the rest for you!
What is Code Magic?
Code Magic is a CI/CD tool for mobile applications, and one of my favorite tools out there. It supports Flutter, native Android and iOS, React Native, Ionic, and Unity. Code Magic is a registered trademark of Nevercode Ltd, and Google partnered with them to make a CI/CD Workflow Editor for flutter developers like us. Before we explore this workflow editor, let’s understand what CI/CD is and why it is important.
What is CI/CD?
CI/CD means Continuous Integration/Continuous Deployment. The main goal of CI/CD is to provide a shorter release cycle. The CI/CD pipeline is one of the best practices for DevOps teams to implement, for delivering code changes more frequently and reliably. It brings automation to your development so that your new code is integrated with previous code automatically while running all necessary tests and building/deploying your application if tests are successful.
Code Magic is free?
Code magic is free for the first 500 build minutes, after that, you have to purchase one of their plans. I think, 500 minutes are enough to make you love this tool. You can even save your build minutes by caching your dependencies.
How to set up Code Magic for Flutter Application?
Now when you know what Code Magic is, let’s dive into the process of automating our workflow:
- Signup to Code Magic. I prefer signing up using GitHub, as both code magic and GitHub are later going to connect ultimately.
- Create your application on Code Magic. Enter all the required details accordingly.
3. Connect your code magic application with the git repository of your flutter application. If you own that repository, Click on GitHub, Bitbucket, or Gitlab accordingly.
If you’re not an owner, but a collaborator to that repository or it's a public repository then you have to click the “Other” option to clone the repository through the URL.
If it's a private repository, you will then be asked to prove your access to the repository. Once done successfully, you should see a workflow editor like this:
This is what we call a Workflow editor, especially designed and developed for Flutter Applications.
4. We have Build platforms, in which you can decide to build platforms for your applications. I would like to build for both android and ios, so I checked both of them.
If you just want to run the test and not build anything, then you can check “Run Tests only”.
5. Next comes is, Build Triggers. You can decide when code magic builds your application, you can automate it by adding push triggers to the repository. In this case, whenever there is a new push to the main or master branch, code magic will start building your application or maybe when pull requests are updated or merged. All up to you!
6. You can also speed up builds by enabling Dependency Caching.
7. You can enable static code analysis, and integration and unit tests (flutter test) by following the required steps:
8. Then we have our main building section, you can specify which android build you need, APK or App bundle and write any additional arguments you may have like no sound null safety, etc.
9. If you would also like an IPA then you need to attach a key from your apple developer account to code magic. Let me show you how to do it:
- Login to app store connect.
- Go to Users & Access > Keys
- Create a new key by clicking on the + icon.
- Type any name for your new key, and give it access permissions of App Manager.
- Download the API key (.p8 file), you can only download it once.
- That’s, now you have the Key ID and the Issuer ID, copy both of them to your code magic account. (User settings > Apple Developer Portal Keys > Add key)
Once added the key successfully, go back to your app, and in the iOS code signing section, select your key and your app store application.
10. That’s it, you will now get both android and ios versions of your application each time there is an update to the repository. (You don’t even need MacBook to do all the XCode stuff). You can do other extra steps if you want to configure the deployment to Firebase, Apple, or Google Play Store accordingly.
Setup completed, that’s all you needed to do. Codemagic remembers your configuration for the next time. Go ahead and make your first-ever build.
11. Take an extra step by integrating Slack and Email to receive build notifications.
Good luck exploring Code Magic, code more and worry less.
That’s it for today, hope you learned something from this article.
I am open to freelance, full-time, or part-time roles, feel free to reach out at Linkedin, thank you!
