DEV Community

Dainy Jose
Dainy Jose

Posted on

Complete CI/CD Guide for React Native Apps Using GitHub Actions

#cicd #github #reactnative #tutorial

Automating builds, testing, and deployments can save hours of manual work in React Native projects. This article explains how to set up a practical CI/CD pipeline for Android and iOS apps using GitHub Actions.

Introduction

As React Native projects grow, manual release processes become difficult.

Developers often spend time:

  • generating APKs manually
  • updating versions
  • testing release builds
  • uploading builds to stores
  • fixing environment issues
  • handling signing configurations

This process becomes repetitive and error-prone.

That’s where CI/CD helps.

A proper CI/CD pipeline can:

  • automate builds
  • reduce human errors
  • improve release consistency
  • speed up deployments
  • help teams collaborate efficiently

In this article, I’ll explain how I set up CI/CD for React Native apps using:

  • GitHub Actions
  • Fastlane
  • Android & iOS workflows
  • environment configurations

What is CI/CD?

CI/CD stands for:

Continuous Integration (CI)

Automatically:

  • validating code
  • running tests
  • checking builds
  • detecting issues early

whenever code is pushed.

Continuous Deployment/Delivery (CD)

Automatically:

  • generating release builds
  • distributing apps
  • deploying to stores
  • handling release workflows

This reduces manual release effort.

Why CI/CD Matters in React Native

React Native projects involve:

  • JavaScript
  • Android native code
  • iOS native code
  • multiple environments
  • third-party SDKs

Without automation, release management becomes difficult.

Tools You Can Use

1. GitHub Actions

Used for:

  • workflow automation
  • build pipelines
  • running scripts
  • deployment triggers

2. Fastlane

Used for:

  • Android Play Store uploads
  • TestFlight uploads
  • signing management
  • screenshots and metadata

3. Firebase Crashlytics

Used for:

  • crash monitoring
  • release issue tracking
  • production debugging

Recommended Project Setup

Before setting up CI/CD, ensure:

- separate environments
- proper signing setup
- release build testing
- version management
- secure secret storage
Enter fullscreen mode Exit fullscreen mode

This prevents many pipeline issues later.

Step 1: Create GitHub Actions Workflow

Inside your project:

.github/workflows/
Enter fullscreen mode Exit fullscreen mode

Create:

android-build.yml
Enter fullscreen mode Exit fullscreen mode

Example:

name: Android Build

on:
  push:
    branches:
      - main

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout Code
        uses: actions/checkout@v4

      - name: Setup Node
        uses: actions/setup-node@v4
        with:
          node-version: 20

      - name: Install Dependencies
        run: npm install

      - name: Build Android APK
        run: |
          cd android
          ./gradlew assembleRelease
Enter fullscreen mode Exit fullscreen mode

This automatically generates Android release builds.

Step 2: Configure Secrets Securely

Never store:

  • API keys
  • keystore passwords
  • certificates
  • signing configs

inside the repository.

Use:

GitHub Repository Secrets
Enter fullscreen mode Exit fullscreen mode

for:

  • signing passwords
  • Firebase configs
  • Play Store credentials
  • App Store credentials

Step 3: Android Signing Setup

For Android release builds:

android/app/release.keystore
Enter fullscreen mode Exit fullscreen mode

Configure:

signingConfigs
Enter fullscreen mode Exit fullscreen mode

inside:

android/app/build.gradle
Enter fullscreen mode Exit fullscreen mode

Example:

release {
   storeFile file(MYAPP_UPLOAD_STORE_FILE)
   storePassword MYAPP_UPLOAD_STORE_PASSWORD
   keyAlias MYAPP_UPLOAD_KEY_ALIAS
   keyPassword MYAPP_UPLOAD_KEY_PASSWORD
}
Enter fullscreen mode Exit fullscreen mode

Step 4: iOS CI/CD Setup

iOS setup is slightly more complex because of:

  • certificates
  • provisioning profiles
  • code signing
  • macOS runners

GitHub Actions requires:

runs-on: macos-latest
Enter fullscreen mode Exit fullscreen mode

for iOS builds.

Step 5: Fastlane Integration

Fastlane simplifies deployments.

Install:

bundle exec fastlane init
Enter fullscreen mode Exit fullscreen mode

Android Deployment Example 

lane :android_release do
  gradle(task: "assembleRelease")
end
Enter fullscreen mode Exit fullscreen mode

iOS Deployment Example 

lane :ios_release do
  build_app
  upload_to_testflight
end
Enter fullscreen mode Exit fullscreen mode

This automates deployment significantly.

Step 6: Automate Version Management

One common problem in mobile releases:

  • incorrect build numbers
  • duplicate version codes
  • store upload failures

Automate:

  • Android versionCode
  • iOS build number
  • semantic versions

inside CI/CD pipelines.

This reduces release mistakes.

Step 7: Run Quality Checks Before Builds

Before generating release builds, I recommend running:

Lint 

npm run lint
Enter fullscreen mode Exit fullscreen mode

TypeScript Check 

npx tsc --noEmit
Enter fullscreen mode Exit fullscreen mode

Tests 

npm run test
Enter fullscreen mode Exit fullscreen mode

This prevents broken builds from reaching production.

Handling Multiple Environments

In production apps, we usually have:

- development
- staging
- production
Enter fullscreen mode Exit fullscreen mode

I manage environments using:

.env.development
.env.production
Enter fullscreen mode Exit fullscreen mode

with separate workflows.

Example:

if: github.ref == 'refs/heads/main'
Enter fullscreen mode Exit fullscreen mode

for production deployments.

Common CI/CD Issues I Faced

1. Android Build Works Locally but Fails in CI

Usually caused by:

  • missing SDK versions
  • Gradle mismatch
  • Java version issues

2. iOS Signing Failures

Most common problem in iOS pipelines.

Usually related to:

  • certificates
  • provisioning profiles
  • Apple Developer configuration

3. Environment Variables Missing

Sometimes release builds fail because CI environments do not load .env correctly.

Always validate:

  • workflow variables
  • secret mappings
  • build configurations

4. Slow Build Times

Large React Native projects can become slow in CI.

Build times can be improved using:

  • dependency caching
  • Gradle caching
  • npm caching
  • selective workflows

My Recommended CI/CD Practices

1. Always Test Release Builds

Debug builds are not enough.

2. Keep Secrets Secure

Never commit sensitive credentials.

3. Automate Repetitive Tasks

Anything repeated manually should probably be automated.

4. Separate Development & Production Pipelines

This prevents accidental releases.

5. Monitor Releases Properly

Use:

  • Crashlytics
  • logs
  • analytics
  • release monitoring

for production stability.

Benefits of Implementing CI/CD

After setting up CI/CD:

  • releases became faster
  • fewer manual mistakes happened
  • deployments became more consistent
  • onboarding developers became easier
  • debugging release issues improved

Most importantly, the release process became predictable.

Final Thoughts

CI/CD may initially feel complicated in React Native projects.

Especially because mobile apps involve:

  • Android builds
  • iOS signing
  • native dependencies
  • environment management

But once configured properly, it saves a huge amount of development time.

Even a basic CI/CD setup can dramatically improve team productivity and release quality.

Start simple.
Then gradually automate:

  • testing
  • builds
  • deployments
  • versioning
  • monitoring

over time.

How are you managing CI/CD in your React Native projects?

Are you using:

  • GitHub Actions
  • Fastlane
  • Bitrise
  • CircleCI
  • Expo EAS

Share your workflow in the comments 👇

✍️ Written by Dainy Jose — React Native Mobile Application Developer with 3+ years of experience building cross-platform mobile apps using React Native (Expo, TypeScript, Redux).
Currently expanding backend knowledge through the MERN Stack (MongoDB, Express.js, React.js, Node.js) to create more efficient, full-stack mobile experiences.

💼 Tech Stack: React Native · TypeScript · Redux · Expo · Firebase · Node.js · Express.js · MongoDB · REST API · JWT · Jest · Google Maps · Razorpay · PayU · Agile · SDLC · Git · Bitbucket · Jira

📬 Connect with me:
🌐 Portfolio
🔗 LinkedIn
💻 GitHub

Top comments (0)