React Native - Android & IOS development

__react-native.md

React Native

Android Development

SDK location and tools

ANDROID_SDK_ROOT=%LOCALAPPDATA%\Android\Sdk

PATH:

%LOCALAPPDATA%\Android\Sdk\platform-tools
%LOCALAPPDATA%\Android\Sdk\emulator

Emulator CLI

List all AVDs

emulator -list-avds

Run AVD

emulator -avd $nameOfAvd

Gradle

It's adviced to install Gradle in order to be able to clean caches and do other helpful stuff.

Gradle location on windows: C:\Users\user\.gradle\wrapper\dists\gradle-<version>\.......\bin

Installing Gradle on Ubuntu: https://linuxize.com/post/how-to-install-gradle-on-ubuntu-18-04/

adding-firebase.md

Firebase with React Native

React-Native for Android

https://developers.google.com/android/guides/client-auth

keytool -list -v -alias androiddebugkey -keystore %USERPROFILE%.android\debug.keystore

in C:\Users\zekar.android: keytool -list -v -alias androiddebugkey -keystore debug.keystore

react-native-google-signin/google-signin#224: keytool -exportcert -list -v -alias androiddebugkey -keystore ~/.android/debug.keystore https://developers.google.com/android/guides/client-auth

https://stackoverflow.com/questions/40088741/google-sign-in-error-statusstatuscode-developer-error-resolution-null

---

about web client id: react-native-google-signin/google-signin#263 react-native-google-signin/google-signin#19

react-native-google-signin/google-signin#683

---

if DEVELOPER_ERROR, then configure SHA 1 fingerprint https://stackoverflow.com/questions/54417232/react-native-google-signin-gives-developer-error

---

flutter issue

flutter/flutter#12140

React-Native for iOS

Follow this tutorial: https://rnfirebase.io/docs/v5.x.x/installation/ios (src 2: https://firebase.google.com/docs/ios/setup#add_the_sdk) Then follow this to enable Authentication (very easy): https://rnfirebase.io/docs/v5.x.x/auth/ios

Q: Where is Bundle Identifier?

When adding the project in Firebase console, you can find iOS Bundle Identifier via XCode project - https://gyazo.com/bd077a0cfc14dbed860ca864282f43c8

Q: How to add .plist files into XCode?

When Firebase console generates GoogleService-Info.plist file, add it into ios/<app-name> folder. Then open XCode project, choose <app-name>, then File -> Add files to <app-name> and select GoogleService-Info.plist from the ios/<app-name> folder. GIF: https://gyazo.com/ab9297121cf37604034d616931a144fc

src: https://stackoverflow.com/questions/31786362/how-to-add-plist-file-to-all-targets-in-xcode

Q: Firebase gives an error something about Url's not configured for com.googleusercontent.apps...

take REVERSED_CLIENT_ID value from GoogleService-Info.plist and add it via XCode - https://gyazo.com/b26d9bff1c0b152e1d79d358f69facdf

src: https://developers.google.com/identity/sign-in/ios/start-integrating src: googlesamples/google-services#81

Q: Cannot find podscpec in '../node_modules/react-native-firebase'

In Podfile (in ios folder), change from

  pod 'RNFirebase', :path => '../node_modules/react-native-firebase'

to

  pod 'RNFirebase', :path => '../node_modules/react-native-firebase/ios'

Backend

Create a Firebase project. You need to correctly specify app name like it's in Android application, e.g com.bikeshop. Also, in order

android-errors.md

Android Errors

Error "Can't find variable $RefreshReg$"

Helpful thread: facebook/react-native#25622

This happens if you mess with metro-react-native-babel-preset. Clear cache and downgrade. Downgrade to 0.54.1

Clear all cache like this person advices: https://gist.github.com/jarretmoses/c2e4786fd342b3444f3bc6beff32098d

For example, for windows:

1. del %appdata%\Temp\react-native-*
2. cd android & gradlew clean
3. cd .. & del node_modules/
4. npm cache clean --force
5. npm install
6. npm start -- --reset-cache

Keystore file '/Project-Folder/android/app/debug.keystore' not found for signing config 'debug' in react-native 0.60

You can generate the debug keystore by running this command in the android/app/ directory: keytool -genkey -v -keystore debug.keystore -storepass android -alias androiddebugkey -keypass android -keyalg RSA -keysize 2048 -validity 10000 src: facebook/react-native#25629

Package signatures do not match the previously installed version

adb uninstall "com.domain.yourapp" src: https://stackoverflow.com/questions/41709102/package-signatures-do-not-match-the-previously-installed-version

If there are still problems with signatures

Delete AVD and download/install a new one

After installing react-natvigation: ERROR: package com.swmansion.gesturehandler.react does not exist

Edit the file android/app/build.gradle and under the dependencies block, add this line: implementation project(':react-native-gesture-handler') src: software-mansion/react-native-gesture-handler#124

Error:Execution failed for task ':app:processDebugResources'. > java.io.IOException: Could not delete folder “” in android studio

cd android && gradlew clean
cd .. && react-native run-android

src: https://stackoverflow.com/questions/35674066/errorexecution-failed-for-task-appprocessdebugresources-java-io-ioexcept

Error after adding react-native-firebase into the project - Execution failed for task ':react-native-gesture-handler:compileDebugJavaWithJavac'

npm i -S jetifier
npx jetify

src: software-mansion/react-native-gesture-handler#647

ios-errors.md

IOS Errors

Fatal error: 'React/RCTBridgeDelegate.h' file not found

Go to ios folder and run pod install src: getsentry/sentry-react-native#395

RCTBridge required dispatch_sync to load RCTDevLoadingView. This may lead to deadlocks

Update AppDelegate.m with this:

#if RCT_DEV
#import <React/RCTDevLoadingView.h>
#endif
...
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  ...
  RCTBridge *bridge = [[RCTBridge alloc] initWithBundleURL:jsCodeLocation
                                            moduleProvider:nil
                                             launchOptions:launchOptions];
#if RCT_DEV
  [bridge moduleForClass:[RCTDevLoadingView class]];
#endif
  RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge
                                                   moduleName:@"Test"
                                            initialProperties:nil];
  ...
}

src: facebook/react-native#16376

emulator -avd Pixel_2_API_28