Continuous Integration And Continuous Delivery For React Native

Learn Continuous Integration and Continuous Deployment / Delivery to increase your employability in 2019 and beyond!

Last updated 2022-01-10 | 4.7

- Apply complete CI/CD flows in their app development process.
- Use GitHub to trigger code checks and app distribution to users.
- Use App Center to automate checks and protect important branches.

What you'll learn

Apply complete CI/CD flows in their app development process.
Use GitHub to trigger code checks and app distribution to users.
Use App Center to automate checks and protect important branches.
Leverage App Center to automatically create builds on every merge.
Automate the distribution of a new build to beta testers.
A full list of other features are on this page.

* Requirements

* The course does not require any previous CI/CD or DevOps experience
* Some basic Git & GitHub experience is desirable
* While this is a CI/CD course
* it is oriented to React Native developers
* so some basic React Native development experience is required.

Description

What you will learn in this course?

In this course, you will learn the fundamentals of CI/CD which is short for Continuous Integration/Continuous Delivery and be able to apply these fundamentals in your React Native app development process.

The word Deployment is often used in place of Delivery but effectively means the same thing.

These skills are essential to maximize your career potential in 2019 and beyond, because more and more companies are adopting these development practices requiring new employees or freelancers to be well versed in these concepts.

What is Continuous Integration (CI) ?

CI is the practice of merging all programmers current working copies to a shared mainline on a regular basis (usually several times a day).

A developer checks out a working copy of the code base prior to making a change.  Over time as other developers check out and make changes, this checked out working copy of the source code base gets out of date, potentially requiring more and more work by developers to actually  check their completed changes back in to the main repository.

Without using CI it can become really difficult to merge all these changes and can lead to it taking more time to  merge changes back into the main source code base than it took to make the the change itself.

CI seeks to eliminate this problem by making sure all developers integrate early and often with the goal to reduce rework and ultimately save cost and time.  This involves all developers merging their code back into the main repository multiple times a day.

An added bonus is that each programmer who is merging changes needs to build and run (and pass) all unit tests which usually run automatically meaning the code base is easier to work with and merge changes into and is potentially more stable as a result.

What is Continuous Delivery or Deployment (CD) ?

This extends CI to ensure that new changes to software can be released to clients quicker, but in a more sustainable way.  It takes the advantages of CI from a development perspective (automated testing, on code check-in, etc) allowing the actual code base to be built and new releases to be automatically released to the client, effectively meaning a new version can be deployed to the client by a click of a button.

CI/CD concepts.

By adhering to a CI/CD development process, the code base can be built and released more quickly, and is in a more stable state overall.  These are some of the reasons why more and more companies are adopting a CI/CD development process in 2019 and beyond.

Key topics in this course.

1. Continuous Integration

2. Continuous Delivery

3. App Center

4. GitHub Pull Requests

5. Branch protection

6. UI Tests

7. App Diagnostics

8. App Analytics

What will you learn?

• Learn how to track errors and crashes in your apps.

• Learn how to track any event triggered within your apps.

• Apply complete CI/CD flows in your app development process.

• Use GitHub to trigger code checks and app distribution to users.

• Use App Center to automate checks and protect important branches.

• Leverage App Center to automatically create builds on every merge.

• Automate the distribution of a new build to beta testers.

• Automate the distribution of new releases to the Google app store.

• Focus on the development of features, leave the build and distribution to App Center.

• Improve teamwork with automatic builds and checks that improve the quality of your merges.

• Enable product discovery with the help of Analytics in the App Center.

• Test your app in a wide array of cloud-hosted physical devices.

Differences with other CI/CD courses.

While there are other CI/CD courses out there, most of them are too general. This course is completely tailored to React Native developers, this way you can immediately start applying what you learn in your app development process. Because of this, the course also covers topics not normally found on other CI/CD courses, such as UI Testing for React Native app development.

Who is the course aimed at?

The course does not require any previous CI/CD or DevOps experience, although some basic Git & GitHub experience is desirable.

While this is a CI/CD course, it is oriented to React Native app developers, so some basic React Native app development experience is required.

Getting started

If you are ready to get started, click on the Enroll or Add to Cart button on this page and start taking your CI/CD skills with
React Native to the next level.

Who this course is for:

  • React Native developers looking to become skilled in the CI/CD process

Course content

7 sections • 50 lectures

Course Structure Preview 10:52

In this lecture I talk about the topics that this course covers, and describe a bit about what you will learn in each section, just so you get the overall idea about what you will learn, and what you may already know about the course topics.

What is DevOps? Preview 04:20

In this lecture I briefly describe the three steps that conform DevOps and the CI/CD process that we will implement with the help of App Center.

Why use DevOps? Preview 11:08

In this lecture I talk about the advantages of implementing a DevOps strategy that includes Continuous Integration, Continuous Quality and Continupus Delivery not only from the developer point of view, but from the user and business POV.

What You Will Accomplish by The End? Preview 25:01

In this lecture I will give you a sneak peak at the entire CI/CD flow entirely integrated with our version control's remote repository on GitHub so that builds and new releases are automatically triggered from App Center.

Source Control And Branch Structure Preview 09:56

Here at the beginning of the section, I talk about why source control is important, and how you should structure your branches so that CI/CD can be easily implemented once we have everything in GitHub.

Initialize Version Control Preview 07:02

In this lecture you will create a new React Native project and initialize the repository in the correct directory, so that the project is ready to commit changes to it and eventually push them to the GitHub remote.

Commiting Changes Preview 08:00

In this lecture you will learn how to commit the changes that you make to your code to your repository, so the changes are tracked and versions of the same file can be identified in the source control system through those git commits.

Creating Branches Preview 07:03

In this lecture you will learn to create new branches directly from the terminal, as well as learn how to switch between them with the checkout command. This step is very important, because it helps set the foundation of the CI/CD process as we will eventually have it in App Center.

Working with Branches Preview 10:48

In this lecture I explain how you can commit different changes to different branches, Visual Studio Code or any editor is aware of the current working branch, and displays what the branch contains, and how you can merge branches together, setting one important piece of the CI/CD puzzle

Creating a GitHub Repo Preview 09:23

In this lecture you will create a new GitHub repository and explore the tabs that it contains, with the purpose of identifying the interface a bit better and starting to understand how Github will relate to the CI/CD process that we want to implement.

Pushing to GitHub Preview 08:12

In this lecture you will push everything from your local repository to your new GitHub remote repository. You will push all the branches that contain all commits, and set upstreams so future push commands are easier to execute.

Working in Teams Preview 06:45

In this lecture I will cover two very important things that GitHub allows us to do inside of a remote repository, and that are going to be the backbone of the CI/CD structure: branch protection and collaboration. One will protect the master branch from unchecked merges, the other will allow other accounts to work in the same repository.

Making Pull Requests Preview 11:58

In this lecture you will create your first pull requests inside of the GitHub repository that we have created as the remote for our local repo. These pull requests will merge changes from dev to test, and eventually to master, which is protected so we will need to add an aproving review.

A Simulated CI/CD Rundown Preview 08:40

In this lecture we are going to simulate a CI/CD rundown with the GitHub repository that we already have. We are going to be deploying some part of our code with the help of GitHub Pages, and we will use pull requests to simulate how eventually a Continuous Delivery process can work.

Intro to App Center Preview 08:15

In this lecture we will start to talk about App Center, what services it provides, which we are going to be using, and how it will help us not only implement a CI/CD process, but identify what features we must add to our apps.

Creating an App Center Account Preview 13:26

In this lecture you will create your new App Center account and explore what features you have inside. Create an organization that will hold distribution groups (important for the CD process) and add the app that you will use throughout the course.

Connecting App Center Preview 15:56

In this lecture you will prepare a new React Native application to connect to App Center through some frameworks that we have to add. This will be done through the AppDelegate class in the iOS project and the stings XML file in the Android project and the initialization will prepare the projects to communicate with the App Center App we have ready in the portal.

Source Code and GitHub Repo Preview 08:21

In this lecture I will push all of our code over to GitHub and explain the two ways in which you can get the source code for each lecture of the course in which we work with code.

Crashing the Application Preview 12:57

In this lecture we are going to be crashing the application in a couple of ways, and run the application on both an Android emulator and an iOS simulator, so that information is sent to App Center and we see the default functionality for both crashes and analytics.

Uploading iOS Symbols to App Center Preview 07:22

In this lecture we will upload the iOS symbols required for App Center to correctly read and identify the information that exists inside the crash information that it already received, so that it is displayed correctly to us.

Check if the App Crashed in previous session Preview 06:05

In this lecture you will use a Crashes method to figure out if the app crashed previously so that you can apologize t your users for that inconvenience.

Tracking All Kinds of Events Preview 07:12

In this lecture you will code the functionality that tracks events, which can be added anywhere you want. Then, you will explore how this information gets added to App Center.

Tracking Events with Better Context Preview 07:12

In this lecture you will learn how to track more context when the events are reported to app center, so as developers we understand better how our users behave inside the application and know what to improve.

Why Use Continuous Integration? Preview 08:07

In this lecture we cover the benefits of using Continuous Integration, and the reasons why you should consider always using it when you create new mobile app projects.

Working with Feature Branches Preview 10:20

In this lecture you will first make sure that the remote repository contains all the main branches that we have mentioned that we need. You will then fetch all those branches to some new local branches, and finally work with a new feature branch that has to be merged into dev.

A First CI Build Preview 13:49

In this lecture you will setup Continuous Integration for one of your branches for the iOS and Android apps that you have on App Center. This CI process will then be triggered when we merge into the dev branch from one of our feature branches.

Adding Checks to Pull Requests Preview 16:53

In this lecture you will enable checks in your pull requests by making App Center send information to your GitHub repository, just like the GitHub repo was already sending info to App Center.

Cleaning Up the Connections Preview 06:38

After we had to create an additional App Center app, we created a big mess within our GitHub and App Center accounts, in this lecture, we will clean that mess up by identifying what happened on GitHub and App Center, and making sure that everything is clean and ready to keep working with Continuous Integration.

Using Checks to Protect Branches Preview 11:25

In this lecture we will use the checks that have been added to our GitHub repository from App Center to protect our branches, so that merges can only happen once the checks (builds) have succeeded.

A Complete CI Flow Preview 13:56

In this lecture we will execute a complete CI flow by coding a new feature into a new feature branch. This new feature, coded from Visual Studio Code, will eventually be pushed to the remote, where we will create a few pull requests, which will themselves trigger checks and builds in App Center.

Intro to Continuous Quality Preview 06:36

In this lecture we will discuss what Continuous Quality means in the context of App Center, and how the power of App Center will allow us to automate the tests of our app (that we will create with Appium) in thousands of physical devices with what once was Test Cloud.

Prepare Android Project for Tests Preview 11:07

In this lecture you will add a new test class to the project, which will contain the test that we will have to run. After that, you will prepare the Android project to execute those tests, which will mean adding some Test cloud information and disabling some mono runtime features here and there.

Prepare iOS Project for Tests Preview 12:10

In this lecture you will add a new project to the solution, which will contain the tests that we will have to run. After that, you will prepare the iOS project to execute those tests, which will mean adding some Test cloud information and disabling some mono runtime features here and there.

Installing the App Center CLI Preview 03:22

In this lecture you will install the App Center CLI tools that will be necessary for the tests to be uploaded from our local machine to the Continuous Quality service that we will use throughout this section.

Uploading the Android Tests Preview 15:38

In this lecture we will prepare the Android project to create the APK file everytime it builds, and use the App Center CLI (Command Line Interface) to upload this APK file with the debug UI test configuration to App Center, where our test will run on as many physical devices as we want.

Uploading the iOS Tests Preview 12:56

In this lecture we will prepare the iOS project to create a UI test build, and use the App Center CLI (Command Line Interface) to upload this test build with the release UI test configuration to App Center, where our test will run on as many physical devices as we want.

Running Automatic Tests - iOS Preview 14:34

In this lecture we will take a sneak peak at what automatic tests behave on App Center. Some automatic tests will be performed when the Continuous Integration process is triggered and be part of the CI process itself. This being the iOS configuration, and the tests having to run on a real device, will need the builds to be signed, wo we will create a provisioning profile to do that.

Running Automatic Tests - Android Preview 07:26

In this lecture we will configure the same type of automatic tests on real devices as in the previous lecture, but this time for Android builds.

Intro to Continuous Delivery Preview 07:02

In this lecture I will discuss what Continuous Delivery means in the context of our mobile applications, and walk you through the actions that App Center will have to perform to get our apps to our users, through distribution groups, and through the Play Store and App Store.

Creating an iOS Distribution Group Preview 10:36

In this lecture you will be creating a distribution group for the iOS and Android applications, which will be used by our continuous delivery process to distribute a new release of our application from the test branch everytime a pull request happens. We will also configure that distribution group within App Center to automatically manage devices and register them with apple with the help of a distribution certificate.

Configuring Android Continuous Delivery Preview 07:09

In this lecture we will configure our Android test branch to create a new release everytime a new build is triggered with Continuous Integration. This will require us to create a keystore file with the help of the JDK.

Configuring iOS Continuous Delivery Preview 07:46

In this lecture we will configure our iOS test branch to create a new release everytime a new build is triggered with Continuous Integration. For this we ned a new ad hoc distribution provisioning profile. We will also trigger our new continuous delivery process.

Installing from App Center - Android Preview 06:18

In this lecture you will learn how your beta testers will be able to install the application's releases that we have generated directly on their Android devices with the help of App Center, and start to use those new versions that we have prepared through Continuous Delivery.

Installing from App Center - iOS Preview 07:13

In this lecture you will learn how your beta testers will be able to install the application's releases that we have generated directly on their iOS devices with the help of App Center, and start to use those new versions that we have prepared through Continuous Delivery.

Connecting the Play Store to App Center Preview 11:19

App Center requires that we create an initial release of our Android Application in the Google Play Console, so that new releases can later be automated through a continuous integration and continuous delivery process triggered in our master branches.

Connecting the iOS App Store to App Center Preview 07:50

App Center requires that we create an initial release of our iOS Application in App Store Connect, so that new releases can later be automated through a continuous integration and continuous delivery process triggered in our master branches.

Continuous Delivery to the App Store Preview 06:08

In this lecture you will connect the App Store to App Center so that Continuous Delivery is ready from the master branch. This will happen with the help of some provisioning profiles and a distribution certificate.

Continuous Integration / Continuous Delivery Preview 18:25

In this lecture we will trigger an entire CI/CD flow directly from GitHub and into the master branch, so that the CI process builds a new version of the app, and the CD process distributes it to the App Store.