Build a React Native App and Authenticate with OAuth 2.0

React Native is a pretty slick framework. Unlike Ionic and other hybrid mobile frameworks, it allows you to use web technologies (React and JavaScript) to build native mobile apps. There is no browser or WebView involved, so developing a mobile app with React Native is similar to using the native SDK, in that you’ll do all your testing on an emulator or device. There is no way to test it in your browser like there is with Ionic.

https://scotch.io/tutorials/build-a-react-native-app-and-authenticate-with-oauth-20

ReactNative info

Get started with React Native and Expo in minutes: https://matwrites.com/get-started-react-native-expo-minutes/

Mobile app development using React Native: https://www.youtube.com/watch?v=JbaZs1dzsVo

react-native tutorial : https://www.youtube.com/playlist?list=PL8p2I9GklV44z6euF3nqS0TlKbaGiFUGO&disable_polymer=true

Learning React Native: http://www.reactnativeexpress.com/

Manual Click button: TouchableOpacity : http://facebook.github.io/react-native/docs/touchableopacity.html

Fullscreen Background Image in React Native: https://kylewbanks.com/blog/fullscreen-background-image-in-react-native

Developing Multi-Slider-Switch in React Native: https://medium.com/@victorvarghese/developing-multi-slider-switch-in-react-native-a15b83b29828

ReactNative install. I got some Error. But I can solved.

Android Setup:
NEW:
http://facebook.github.io/react-native/releases/0.48/docs/getting-started.html

OLD:
https://facebook.github.io/react-native/releases/0.23/docs/android-setup.html

Android Setup 2: https://facebook.github.io/react-native/releases/0.23/docs/getting-started.html#content

**********************
Error:
C:\ReactNative\AwesomeProject>react-native run-android
Scanning 575 folders for symlinks in C:\ReactNative\AwesomeProject\node_modules (49ms)
Starting JS server…
Building and installing the app on the device (cd android && gradlew.bat installDebug)…

FAILURE: Build failed with an exception.

* What went wrong:
A problem occurred configuring project ‘:app’.
> SDK location not found. Define location with sdk.dir in the local.properties file or with an ANDROID_HOME environment variable.

* Try:
Run with –stacktrace option to get the stack trace. Run with –info or –debug option to get more log output.

BUILD FAILED

Total time: 14.858 secs
Could not install the app on the device, read the error above for details.
Make sure you have an Android emulator running or a device connected and have
set up your Android development environment:
https://facebook.github.io/react-native/docs/android-setup.html
**************************

Solving Error:
(https://facebook.github.io/react-native/releases/0.23/docs/android-setup.html)
Define the ANDROID_HOME environment variable
On Windows, go to Control Panel -> System and Security -> System -> Change settings -> Advanced -> Environment variables -> New
//
Add an environment variable ANDROID_HOME pointing at your sdk. In Windows it might look something like C:\Users\XXXX\AppData\Local\Android\Sdk . Don’t forget to restart your terminal.
//
new ANDROID_HOME , C:\Users\zsolt\AppData\Local\Android\Sdk
*********
New Error:

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ‘:app:installDebug’.
> com.android.builder.testing.api.DeviceException: No connected devices!

* Try:
Run with –stacktrace option to get the stack trace. Run with –info or –debug option to get more log output.

BUILD FAILED

Total time: 3 mins 10.938 secs
Could not install the app on the device, read the error above for details.
Make sure you have an Android emulator running or a device connected and have
set up your Android development environment:
https://facebook.github.io/react-native/docs/android-setup.html

***********************************************************

New error:
FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ‘:app:installDebug’.
> com.android.builder.testing.api.DeviceException: Could not create ADB Bridge. ADB location: C:\Users\zsolt\AppData\Local\Android\Sdk\platform-tools\adb.exe

* Try:
Run with –stacktrace option to get the stack trace. Run with –info or –debug option to get more log output.
*****************************************************

I Found:

I have solve it, The error is because Genymotion use its own SDK not custom SDK location.I solved this question with the URL follow:

https://stackoverflow.com/questions/36769699/react-native-run-android-deviceexception-could-not-create-adb-bridge

*************************************
Error:
BUILD SUCCESSFUL

Total time: 36.28 secs
error: could not install *smartsocket* listener: cannot bind to 127.0.0.1:5037: Az összes szoftvercsatorna-cím használatának általában csak egy módja (protokoll/hálózat cím/port) engedélyezett. (10048)
could not read ok from ADB Server
* failed to start daemon *
error: cannot connect to daemon
Starting the app (C:\Users\zsolt\AppData\Local\Android\Sdk/platform-tools/adb shell am start -n com.awesomeproject/com.awesomeproject.MainActivity…
error: no devices/emulators found
**************************************

Solution:

More install: http://facebook.github.io/react-native/releases/0.48/docs/getting-started.html
Google APIs
Android SDK Platform 23
Intel x86 Atom_64 System Image
Google APIs Intel x86 Atom_64 System Image

Avd
Select the “x86 Images” tab, then look for the Marshmallow API Level 23, x86_64 ABI image with a Android 6.0 (Google APIs) target.

****************************************
SUCCESS!:
I have to launch manually the emulator.

BUILD SUCCESSFUL

Total time: 55.984 secs
Running C:\Users\zsolt\AppData\Local\Android\Sdk/platform-tools/adb -s emulator-5554 reverse tcp:8081 tcp:8081
adb server version (36) doesn’t match this client (39); killing…
* daemon started successfully *
Starting the app on emulator-5554 (C:\Users\zsolt\AppData\Local\Android\Sdk/platform-tools/adb -s emulator-5554 shell am start -n com.awesomeproject/com.awesomeproject.MainActivity)…
Starting: Intent { cmp=com.awesomeproject/.MainActivity }

C:\ReactNative\AwesomeProject>

Welcome to Rect Native! appeared.

***********************************