Expo After Detaching: Building APK or IPA and Basic concepts

Published by Anand on

Expo after detaching might be confusing, especially if you do not have prior native development experience with Android or iOS apps. Let’s discuss some basic concepts of detached Expo apps and how to build production APK or IPA files after we have detached from expo.

Expo makes it so easy to develop native apps for Android and iOS with a single code base in Javascript. A must know thing for beginners is that “Expo apps” are not “react native apps”. Technically they are, yet not so much. Confusing? Expo is built around react native and it does all the dependency handling under the hood for you. Which in the case of “react-native-cli apps”, you will have to do manually.

If you created your app using the command expo init then its an “Expo app” and if you used react-native init then its a react-native-cli app.  Official documentation of react native suggests both the ways of creating a React native application.

Bottom line: Expo is easy, fast and gives better development exprience!

When to detach from Expo

If Expo is easy then why to detach and enter the realm of manual dependency management by detaching? That because, Expo is new and constantly improving, a lot of features are present in the current Expo SDK but not all. For example, the major missing feature (according to me and many) from Expo is the ability to run background tasks. The core team of Expo developers is working on this one and this is expected to be available in the next major release.

Development with expo is all fairy-tale until you hit such a requirement which Expo does not support (yet). In that case, you will have to detach from Expo and write native code for Android and iOS separately.

How to detach your app from Expo

Command:  exp detach or expo detach

With this single command, expo-cli converts your expo app to a detached react-native app with ExpoKit to keep the magic of Expo still intact.

It is recommended that you commit your code before attempting to detach from Expo.

More details and information can be found on the official detaching guide

What happens after you Detach

Luckily, nothing much! Let me list the major things out

  • Expo-cli app is now converted to a react-native-cli app
  • Two additional directories “ios” and “android” are created
  • The previous code works perfectly fine and you can still use Expo components. Thanks to ExpoKit.

Detaching gives you “ios” and “android”, two additional folders. These folders contain the native code for your Android and iOS apps. You can open the “android” directory in Android studio and the “ios” directory in Xcode and add native features into your app.

Does that mean you can not code in JavaScript anymore?

You’re in luck! Because detaching does not mean you now have to write each code twice in android and ios in native language. You can still write JS code for features that are supported in the expo or react native client.

I think detaching gives your app superpowers. Because

  • Now you can use “react-native-cli” modules in your project
  • You can keep using Expo features
  • You can write native code in Android Studio and Xcode.

Developing after detaching expo app

Go ahead make your changes in the native code and run the app using the “Build and run” feature of Android studio or Xcode as you would run any native app.

Run expo development server using the command: expo start

You need to have the expo development server running for the APK or IPA to work. That is because Expo pulls the JS code from the development server. Remember you can still make changes in the JS code and it will work as expected.

The only thing that changes from your previous workflow is that now you have to install the app from Xcode or Android.

Publishing after detaching expo app

Once you are done with the development its time to build an APK or IPA from the detached expo app.

Before generating the production app, make sure you publish the JS changes to the expo server so that the users can get the JS code.

  • Run command: expo publish
  • Generate APK or IPA from Android studio or Xcode

Now you can distribute the generate application files. Happy coding!