This README file serves as a note for the course. For assignments, please refer to the README files in the corresponding folders:
- Final project: Under the
FinalProject
directory. - HW assignments: In the current directory.
- ICTE assignments: In the
ICTE
directory. - Bonus assignments: In the
Bonus
directory.
npx react-native start
npx react-native run-android
cd android && .\gradlew assembleDebug assembleAndroidTest -DtestBuildType=debug --warning-mode=all && cd ..
detox test --configuration android.att.debug
If dependencies are not installed:
npm install
If running on physical device, run these commands first:
adb devices
adb -s 27071JEGR06636 reverse tcp:8081 tcp:8081
# adb -s LMV600TM67a08f9c reverse tcp:8081 tcp:8081
Start the server:
npx react-native start # optional
npx react-native run-android
# If having EPERM error with lstat:
cd android && ./gradlew clean && cd .. && npx react-native run-android
npx react-native@latest init AwesomeProject
cd MyReactNativeApp
npm install -g yarn
yarn --version
yarn init
yarn add PACKAGE_NAME
https://jestjs.io/docs/getting-started
npm install "jest@^29" --save-dev
https://wix.github.io/Detox/docs/introduction/getting-started/ https://wix.github.io/Detox/docs/api/device
npm install -g detox-cli
npm install "jest@^29" --save-dev
npm install detox --save-dev
Init Detox
detox init
Change the emulator name in .detoxrc.js
:
& "$env:ANDROID_HOME\emulator\emulator" -list-avds
Or using physical device by first checking if it is connected and use android.att.*
when required:
adb devices
Build the app:
detox build --configuration android.emu.debug
detox build --configuration android.emu.release
detox build --configuration android.att.debug
detox build --configuration android.att.release
cd android && .\gradlew assembleDebug assembleAndroidTest -DtestBuildType=debug --warning-mode=all
Run the test:
npx react-native start
cd ..
detox test --configuration android.att.debug
https://github.com/react-navigation/react-navigation https://reactnavigation.org/docs/getting-started/
npm install @react-navigation/native react-native-screens react-native-safe-area-context
npm install @react-navigation/stack react-native-gesture-handler
https://github.com/axios/axios https://axios-http.com/docs/intro
npm install axios
npm install axios-hooks # Optional: https://www.npmjs.com/package/axios-hooks
https://github.com/aws/aws-sdk-js-v3#getting-started https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/preview/Package/-aws-sdk-client-dynamodb/
npm install @aws-sdk/client-dynamod
npm install react-native-get-random-values
npm install react-native-url-polyfill
Basic usage:
import "react-native-get-random-values";
import "react-native-url-polyfill/auto";
const { DynamoDB } = require("@aws-sdk/client-dynamodb");
const creds = {
accessKeyId: "",
secretAccessKey: ""
};
(async () => {
const client = new DynamoDB({ region: "us-west-2", credentials: creds });
try {
const results = await client.listTables({});
console.log(results.TableNames.join("\n"));
} catch (err) {
console.error(err);
}
})();
React Native Async Storage react-native-async-storage
https://github.com/react-native-async-storage/async-storage https://react-native-async-storage.github.io/async-storage/docs/install
npm install @react-native-async-storage/async-storage
https://github.com/zoontek/react-native-permissions
npm install react-native-permissions
https://github.com/michalchudziak/react-native-geolocation
npm install @react-native-community/geolocation
npm install react-native-toast-message
https://github.com/innoveit/react-native-ble-manager https://www.oneclickitsolution.com/blog/ble-plx-in-react-native/
npm i react-native-ble-manager
Android - Update Manifest
// file: android/app/src/main/AndroidManifest.xml
<!-- Add xmlns:tools -->
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
package="YOUR_PACKAGE_NAME">
<!--
HACK: this permission should not be needed on android 12+ devices anymore,
but in fact some manufacturers still need it for BLE to properly work :
https://stackoverflow.com/a/72370969
-->
<uses-permission android:name="android.permission.BLUETOOTH" tools:remove="android:maxSdkVersion" />
<!--
should normally only be needed on android < 12 if you want to:
- activate bluetooth programmatically
- discover local BLE devices
see: https://developer.android.com/guide/topics/connectivity/bluetooth/permissions#discover-local-devices.
Same as above, may still be wrongly needed by some manufacturers on android 12+.
-->
<uses-permission android:name="android.permission.BLUETOOTH_ADMIN" tools:remove="android:maxSdkVersion" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" android:maxSdkVersion="28"/>
<uses-permission-sdk-23 android:name="android.permission.ACCESS_FINE_LOCATION" android:maxSdkVersion="30"/>
<!-- Only when targeting Android 12 or higher -->
<!--
Please make sure you read the following documentation
to have a better understanding of the new permissions.
https://developer.android.com/guide/topics/connectivity/bluetooth/permissions#assert-never-for-location
-->
<!-- Needed if your app search for Bluetooth devices. -->
<!--
If your app doesn't use Bluetooth scan results to derive physical location information,
you can strongly assert that your app doesn't derive physical location.
-->
<uses-permission android:name="android.permission.BLUETOOTH_SCAN"
android:usesPermissionFlags="neverForLocation" />
<!-- Needed if you want to interact with a BLE device. -->
<uses-permission android:name="android.permission.BLUETOOTH_CONNECT" />
<!-- Needed if your app makes the current device discoverable to other Bluetooth devices. -->
<uses-permission android:name="android.permission.BLUETOOTH_ADVERTISE" />
...
npm install react-native-image-picker
Add permissions to AndroidManifest.xml
:
File path: \android\app\src\main\AndroidManifest.xml
:
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.CAMERA" />
Set newArchEnabled
to true inside android/gradle.properties
https://github.com/react-native-sensors/react-native-sensors
npm install react-native-sensors
npx install-expo-modules@latest
npx expo install expo-face-detector
File path: android/app/src/main/res/values/styles.xml
:
Change <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
to <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
File path: \android\app\src\main\AndroidManifest.xml
:
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />