HomeMobile AppsWhat is Expo?

What is Expo?

This blog is to give an insight on what Expo is and what Expo can do for React Native developer.

There are two ways to start building a new React Native Application, either with React-Native CLI or with Expo CLI(previously it was create-react-native-app). The first notable difference between both is ease of getting started, without any configuration or any initial setup, which is provided by Expo CLI. You don’t need to install XCode or Android Studio to build native code which is not the case with React-Native CLI.
To install Expo CLI, we can use npm to install it (Assuming that node is already installed).

npm install -g expo-cli

Then to create a new React-Native project, we need to do

expo init NewProject
cd NewProject
npm start

And that’s it, without any hassle of installing XCode or Android Studio we can start building our React-Native App. And to run our application we can install Expo Client on our Android or iOS phone and connect to the same wireless network as our computer and then follow the instructions on terminal to open the app in Android or iOS phone.

Advantages of using Expo

  • Expo apps contain Expo SDK which can handle a device’s system functionality such as camera, storage, contacts etc. which otherwise requires writing native code or to use Android Studio or Xcode.
  • Expo provides service by which we can build native binaries(ipa or apk) which then can be deployed to Google play store and Apple Store.
  • Expo provides UI component such as icons, blur views that are not available in React Native.
  • Push Notifications can be easily managed using Expo, we don’t need to install any third party library.

Publishing App using Expo

To publish our app, all we need to do is run a command as below

expo publish

This will deploy our app to a persistent URL which can be shared with our users to be opened with Expo Client. And if we want to deploy an update, we need to publish it again using

expo publish

and then the update will be available to the user whenever they will open the app again.

Note: Due to restriction imposed by Apple, we can’t share link to an iOS user. To share the published app with an iOS user, we need to build native binary using Expo’s service. We can then invite testers using Apple TestFlight.

Deploying App to Google Play Store and Apple Store

Firstly we need to configure our app.json to something like this

 {
   "expo": {
    "name": "Your App Name",
    "icon": "./path/to/your/app-icon.png",
    "version": "1.0.0",
    "slug": "your-app-slug",
    "sdkVersion": "XX.0.0",
    "ios": {
      "bundleIdentifier": "com.yourcompany.yourappname"
    },
    "android": {
      "package": "com.yourcompany.yourappname"
    }
   }
 }

The above code sample includes only with required option. We can add other option to our app.json according to our requirements which we can check out here: https://docs.expo.io/versions/v28.0.0/workflow/configuration.html.

Next step is to Start the build process, which is done by using following command

For Android

expo build:android

When building for the first time it will ask you to choose from two option regarding keystore, one is to upload it and another one is to let Expo handle it.

For iOS

expo build:ios

Similar to Android, when building for first time for iOS, it will ask you to choose from two option regarding distribution certificate, one is to use your own and another one is to let Expo handle it.

After the process of build is finished, You can test your App on your android device and upload it to TestFlight for testing on iOS device.

Now, we can upload our app to Apple Store or Google Play Store. You can go through Guidelines for Deploying app to App Store here: https://docs.expo.io/versions/v31.0.0/distribution/app-stores.html

Updating your App

To update your app simply re publish the app by running

expo publish

These updates are also known as OTA or “over the air” updates. But this updates will only work if the changes were made in JavaScript. If we make changes in native metadata like app’s name or icon or we upgrade our Expo sdkVersion to newer version then we need to build our app again and then need to deploy it again to App Store.

Disadvantages

Expo is a great tool for developing react-native apps but it is not without shortcomings.

  • As of now, Expo apps don’t support code execution in background. This means we cannot use background geolocation, play audio in the background, handle push notifications in the background, and more.
  • Expo includes bunch of API regardless of whether we are using them or not, which leads to bigger size of app, for Android it is around 20mb and for iOS it is around 33mb. But Expo team are working on this, so that we can reduce the size of our app.
  • Expo apps don’t have all iOS and Android device API, for example Bluetooth and WebRTC.
  • If we need to use third party push notification library, we need to make changes in Android and iOS project files which are not available in Expo apps and also for this reason we cannot write our own native code for our app.

If our use case falls in any of the above, we can eject from Expo which will produce Android and iOS project file and then we can configure them as we like. We have two choices when we eject from Expo either to fully remove expo which gives us project similar to React-Native CLI or to partially remove Expo in which we can still use Expo SDK and also can configure Android and iOS project files.

References: https://docs.expo.io/versions/v31.0.0/introduction/

Leave a Reply

Your email address will not be published. Required fields are marked *

%d bloggers like this: