Intergrating GitHub Actions For Automating App Builds
Trigger builds for your Expo app with EAS Build using GitHub Actions and make app development a breeze through automation
In this article, I'll be demonstrating how I managed to automate builds for iOS and Android for my Expo app.
There are many repetitive tasks that we do to build our app before submitting it to the testflight
for testing whenever we make new changes. What if someone else could do these tasks for you whenever you push your code to some branch?
Say hello to GitHub Actions! ๐ค
GitHub Actions are commands that we can trigger when something changes in our repository. In this article, we'll be writing a pipeline for our Expo Managed App
that will trigger a new testflight
build using EAS Build and make it available to all the testers whenever we push our code to the development
branch. As we are doing this using the EAS Build, let's look at a quick introduction to EAS Build.
EAS Build is a new feature from Expo, it is a hosted service for building app binaries for your Expo and React Native projects. It makes building your distributing apps simple and easy by automating and providing defaults that work well for Expo and React Native projects out of the box. They can also handle your app by signing credentials for you (if you wish). EAS Build also makes sharing builds with your team easier than ever with internal distribution (using ad hoc and/or enterprise "universal" provisioning) and it also deeply integrates with EAS Submit for app store submissions as it has first-class support for the expo-updates library.
It's the next generation of the expo build:[ios/android] command and is designed to work for any native project, whether or not you also use the managed workflow. It's the fastest way to get code from expo init
or npx react-native init
to app stores.
If you want to read more about EAS build. Head over to these docs.
Triggering builds Using GitHub Actions
Before building with EAS on CI, we need to install and configure eas-cli
. Then, we can trigger new builds with the eas build
command. Let's see how this is done:
Prerequisites
To trigger EAS builds from a CI environment, we first need to configure our app for EAS Build and successfully run a build from the local machine for each platform that we'd like to support on CI.
If you have run eas build -p [all|ios|android]
successfully before, then you can continue.
Note: For creating builds for ios and android there are multiple configurations that we need to do for certificates and stuff. For that, you can refer to this link.
Configure your app for CI
Create a new file eas-build.yml
and add it into .github/workflows/
in the root of your repository using the snippet given below:
name: EAS PIPELINE
on:
push:
branches:
- development
workflow_dispatch:
jobs:
build:
name: Install and build
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v2
with:
persist-credentials: false
- name: Reconfigure git to use HTTP authentication
run: >
git config --global url."https://github.com/".insteadOf
ssh://git@github.com/
- name: Setup Node.js
uses: actions/setup-node@v1
with:
node-version: 14.x
- name: Setup Expo
uses: expo/expo-github-action@v6
with:
expo-version: 4.x
token: ${{ secrets.EXPO_TOKEN }}
expo-cache: true
- name: Install dependencies
run: npm ci
- name: Authenticate git name
run: git config --global user.name "Sakshya Arora"
- name: Authenticate git email
run: git config --global user.email "sakshya@geekyants.com"
- name: Build on EAS
run: EAS_BUILD_AUTOCOMMIT=${{1}} npx eas-cli build --platform all --non-interactive
deploy:
name: Deploy
runs-on: ubuntu-latest
needs: build
steps:
- name: Checkout
uses: actions/checkout@v2
with:
persist-credentials: false
- name: Reconfigure git to use HTTP authentication
run: >
git config --global url."https://github.com/".insteadOf
ssh://git@github.com/
- name: Setup Node.js
uses: actions/setup-node@v1
with:
node-version: 14.x
- name: Setup Expo
uses: expo/expo-github-action@v6
with:
expo-version: 4.x
token: ${{ secrets.EXPO_TOKEN }}
expo-cache: true
- name: Install dependencies
run: npm ci
- name: Submit to testflight
run: EXPO_APPLE_APP_SPECIFIC_PASSWORD=${{ secrets.EXPO_APPLE_APP_SPECIFIC_PASSWORD }} npx eas-cli submit -p ios --latest --non-interactive
- name: Submit to playstore
run: npx eas-cli submit -p android --latest --non-interactive
Understanding the basic terminologies used in this file.
The
name
to our action ( EAS PIPELINE)The action, which triggers this pipeline (In our case, when we push to the development branch).
Start a list of tasks that should run once this action is triggered.
First one is a build action (Install and build).
runs-on
command which tells GitHub where the runner will execute this job (this is a virtual server and you can choose between Windows/Mac/Linux).Each job can have multiple phases which are grouped together by the
steps
keyword.The
uses
keyword tells the script what action to play.The
needs
keyword tells thejob
that the job should only run after the dependent step is complete. (Our deploy step needs build step to complete first).
Understanding the other main steps of each job in the pipeline.
- You can run a build job using the following command:
- name: Reconfigure git to use HTTP authentication
run: >
git config --global url."https://github.com/".insteadOf
ssh://git@github.com/
- This step is not required for most of the users. In my case, it was required because I was using a package from my own repo and it was being used by utilising
ssh
.For more info - You can look into this issue.
- Here's the command to setup Expo:
- name: Setup Expo
uses: expo/expo-github-action@v6
with:
expo-version: 4.x
token: ${{ secrets.EXPO_TOKEN }}
expo-cache: true
- As the name suggests, this step is to set up Expo and to do this, we need to create an
EXPO_TOKEN
.
To see how to create an access token, you can head over to this link
- After creating the
EXPO_TOKEN
, add that token to the secrets of your GitHub repo using the code given below:
Settings -> Secrets -> New repository secret
- After adding the token, the result should look like this:
- name: Build on EAS
run: EAS_BUILD_AUTOCOMMIT=${{1}} npx eas-cli build --platform all --profile development --non-interactive
- This step is for building an Expo app using
eas build
. You must be wondering aboutEAS_BUILD_AUTOCOMMIT=${{1}}
and simply put it was required because I was using theautoIncrement
property in myeas.json
which requires your code to be committed.
deploy job:
Most of the steps in this job are the same as it is in the build
job. To submit our app, we need to make some changes for iOS and Android in eas.json
.
- Use the following code for iOS:
"ios": {
"appleId": "",
"appleTeamId": "",
"ascAppId": "",
"companyName": ""
}
- For this step, your app must be there in
AppStore connect
in order to get theascAppId
for the app. Use the code given below:
- name: Submit to testflight
run: EXPO_APPLE_APP_SPECIFIC_PASSWORD=${{ secrets.EXPO_APPLE_APP_SPECIFIC_PASSWORD }} npx eas-cli submit -p ios --latest --non-interactive
- This step submits the app to the
testflight
once the build is completed while the--latest
flag is to take the required build from Expo builds. We also require anApple app-specific password
for this step.
Refer to this link to create an
Apple app-specific password
.
- Use the following snippet to submit your build to the store:
- name: Submit to playstore
run: npx eas-cli submit -p android --latest --non-interactive
- For this step, your app must be uploaded to the console manually once.
To sum it up...
These are the basic steps to set up GitHub actions for automating app buils. Refer to the following articles for more news on the subject:
- EAS
- GitHub Actions
- Expo GitHub Actions
- npm ERR! git@github.com: Permission denied (publickey). in GitHub Action.
- npm ci can only install packages with an existing package-lock.json or npm-shrinkwrap.json with lockfileVersion >= 1.
Thanks for reading ๐. I hope this article helped you to create a pipeline for your Expo app. Do comment!