Expo Mega Demo

A demo app created in times of Expo SDK 42-45, when features shown here were new/experimental. Recently it was updated to Expo SDK 54, and they're mature and stable now. See commit for details.

Experimenting with new awesome React Native + Expo features.

Work in progress. More info soon.

A preview video (click the image):

Core features

⚠️ Caution! Some features used in this demo are in early, experimental stage and they're not ready for production. Use at your own risk.

• Runs on Expo SDK 54, takes advantage of the Expo Modules architecture.
• Uses Expo Continuous Native Generation (CNG) - a prebuilding is used to generate native directories. All native changes (even these unusual) and patches are covered with config plugins.
• Uses Expo Dev Client, react-navigation, ui-kitten
• Bluetooth communication using react-native-ble-plx with Expo config plugin.
• Color picker using Expo GL, made from this tutorial from William Candillon, but rewritten to Reanimated v4
• Music Picker is an expo-module written using Swift/Kotlin Expo Modules API.

  🎉 It is now available as a separate library: expo-music-picker!

• JSI real-time Audio streaming, inspired by this PR, thank you Marc!

Now it is included in expo-audio so a custom native module is no longer needed!

• Player controls stolen from NCL (internal Expo rn-tester equivalent).
• FFT is calculated in the JS thread. The spectrum bin heights are written to SharedValues and animated with Reanimated 4.

  There is plan to use react-native-multithreading and calculate it in a separate thread. But even without that, the JS keeps around 57-59 fps.

• Hardware: Arduino Uno and the HM-10 BLE 4.0 module. Read more in the Hardware README.

How to run

First time:

1. Make sure you have Expo and all the stuff installed and configured (including Xcode)
2. Clone the repo and update submodules: git submodule update.
3. yarn install
4. yarn prebuild
5. yarn run:ios

Just to start the bundler (without rebuilding client): run yarn start.

Known issues

Most of them are caused by limited time of mine, and also by some libraries, which depend on Expo, but have not yet been updated to support latest Expo features.

• Frequency bin labels are wrong 🤷. Eventually I needed to display them in log scale and I am too lazy to think about how to recalculate everything properly.
• Modifying the audio callback code and hot reloading while a song is playing sometimes crashes the app with Error: FunctionCallException: Calling the 'setAudioSamplingEnabled' function has failed (at ExpoModulesCore/SyncFunctionDefinition.swift:137) → Caused by: NativeSharedObjectNotFoundException: Unable to find the native shared object associated with given JavaScript object (at ExpoModulesCore/DynamicSharedObjectType.swift:58)]
• May not work on iOS emulator. The JSI Audio should work, but the music picker does not open. And, of course, Bluetooth cannot work on simulator.
• ~~Not yet works for Android~~ There's basic experimental Android support, but with issues:
• GL View sometimes crashes
• JSI Audio might crash after a few seconds
• ...
• Some mentioned in this commit. By the way, Expo upgrading might have fixed some of the above issues, but I haven't checked it yet.

Applied patches

See the the plugins section of app.json to see how the patches are applied: xw

• expo-cli built-in plugins sets the Push Notifications capability even when expo-notifications are not installed and I see no way to disable it. Another plugin was written to delete that entitlement.
• MusicPicker module: iOS requires another Info.plist value about Media Library usage permission - a config plugin takes care of that

No-longer-needed patches and workarounds 🎉

I started this project when Expo SDK 42 came out. So much changed since then and with each release less and less patches and workarounds were needed:

• Linking custom native modules:

• ~~The custom_native_modules directory needs to be added to autolinking paths in Podfile. A config plugin takes care of that.~~ > It appears that it can be configured in package.json as expo.autolinking.searchPaths. It's not needed anyway, look at the next point:

• ~~new expo-modules-autolinking requires modules to be specified in package.json dependencies. I don't want to copy my custom native modules to node_modules they are deleted after being copied there by yarn.~~

• ~~Patched expo-modules-autolinking@0.5.1 to apply changes from this PR until it's published. Now custom native modules dir can be specified in package.json.~~ Finally, this PR is published in upstream expo-modules-autolinking.

• ~~Replaced expo-av with my custom expo-av-jsi native module to support JSI Audio~~

~~The JSI Audio streaming is now included in upstream expo-av@10.2.0 but yet for iOS only. It'a super-secret hidden feature of SDK 44.~~

In SDK 45 both platforms are now supported by Expo AV. 🎉

• ~~patch-package for expo-gl and related libraries - needed, because of migration from @unimodules/core to expo-modules-core~~
• ~~by default, expo modules are built with xcframework if available, but that does not work for patched expo-gl, so its xcframework is deleted force build from source.~~
• ~~expo-gl installs wrong expo-modules-core dependency in its own node_modules - it is deleted, the global node_modules one is correct.~~
• ~~The AppDelegate.m is being broken by expo-dev-client config plugin, wrote another config plugin to copy the patched file.~~
• ~~patch-package for react-native-ble-plx and Podfile config plugin, because of this issue.~~

• There was a postinstall.js script to perform some of the patches above (like file copy/delete). Fortunately it is no longer needed. Yay! 🎉

• ~~patch-package for webgltexture-loader-expo@1.0.0, a dependency of gl-react-expo - it has not yet been updated to use expo-modules-core in favor of @unimodules/core.~~ Upstream version 1.2.0 has it patched 🎉