ito React Native App

Try it out

You can find Android alpha releases on our releases page. Click here to find the latest release. For the app to recognize other devices, make sure to enable Bluetooth.

Architecture

+--------------------------------+
|                                |
|       react-native-app         |
|                                |
| +----------------------------+ |     +----------------+
| |                            | |     |                |
| | react-native-ito-bluetooth +------>+   api-backend  |
| |          library           | |     |                |
| +----------------------------+ |     +----------------+
+--------------------------------+

• react-native-app: React Native app implementation
• react-native-ito-bluetooth: React Native library, which contains native code for handling bluetooth and network communication with the backend. The library is used by the app as an NPM dependency. The exact version is pinned in package-lock.json.
• api-backend: This is the hosted backend implementation. This is work in progress and will replace the old backend-sqlite implementation, that is currently used by the app.

Development

User flow

Take a look at the user flow on Figma. We have implemented the major part of those screen mockups.

Also try our click dummy for a quick demonstration.

Android

Select "React Native CLI Quickstart" and your OS on Environment Setup React-Native.

Don't forget to install the npm dependencies:

npm install

This will also trigger the postinstall script defined in package.json, which will run:

• jetify to do an AndroidX migration for dependencies
• react-native link to link library dependencies

To start the React Native Metro server use:

npm run start

To build the source and install use:

npm run android

To build an APK, run:

npm run build:android

The APK is generated to android/app/build/outputs/apk/release/app-release.apk

iOS

To start the React Native Metro server use:

npm run start

To build the source and install use:

npm run ios

Run the app with a locally modified library

Check out react-native-ito-bluetooth and execute:

npm link

Then, go to your local checkout of react-native-app and execute:

npm link react-native-ito-bluetooth

This will override node_modules/react-native-ito-bluetooth with a symbolic link to your local checkout of react-native-ito-bluetooth. Now your local checkout of the library will appear to be an installed dependency in the node_modules folder of the app and will be recognized as such during build.

Keep in mind, that after modifying library code, you might need to remove the build folders (e.g. android/build) in your react-native-ito-bluetooth checkout. This will force the app project to rebuild the library.

Now you can build and start the app and it will use your locally modified library code:

npm run start

npm run android
npm run ios

Wire the app to a different server

Client/server communication is handled by the library, so you need to locally modify the library code (see previous section).

Check out the backend and run it locally (e.g. using docker-compose).

Find the BASE_URL environment variable in the code of react-native-ito-bluetooth and change it to your local server's url.

Release process

The CI pipeline is implemented using GitHub Actions.

Android

• Build (runs on every push):
  • install the Android SDK
  • build an APK
• Deploy (runs only on git tags):
  • create a GitHub release
  • Upload the APK as release asset

iOS

Not yet implemented