+ All Categories
Home > Documents > React Native Setup · 2020-03-02 · •Python: both 2, 3 works for react native •React Native:...

React Native Setup · 2020-03-02 · •Python: both 2, 3 works for react native •React Native:...

Date post: 04-Jun-2020
Category:
Upload: others
View: 16 times
Download: 0 times
Share this document with a friend
14
React Native Setup WebApp DataLab, CS, NTHU 2019 Spring
Transcript
Page 1: React Native Setup · 2020-03-02 · •Python: both 2, 3 works for react native •React Native: npminstall –g react-native-cli •Window: •Install Python2 and JDK through Chocolatey

React Native SetupWebApp

DataLab, CS, NTHU2019 Spring

Page 2: React Native Setup · 2020-03-02 · •Python: both 2, 3 works for react native •React Native: npminstall –g react-native-cli •Window: •Install Python2 and JDK through Chocolatey

Installation

• Requirements• JDK 8• Python: both 2, 3 works for react native• React Native: npm install –g react-native-cli• Window:

• Install Python2 and JDK through Chocolatey• choco install -y nodejs.install python2 jdk8

• Mac:• Download and install Oracle JDK 8• Modern macOS versions come with Python 2.7.x itself

Page 3: React Native Setup · 2020-03-02 · •Python: both 2, 3 works for react native •React Native: npminstall –g react-native-cli •Window: •Install Python2 and JDK through Chocolatey

Installation

• Android Studio• Choose a "Custom" setup• Make sure the boxes are checked:

• Android SDK• Android SDK Platform• Performance(Intel HAXM)• Android Virtual Device

Page 4: React Native Setup · 2020-03-02 · •Python: both 2, 3 works for react native •React Native: npminstall –g react-native-cli •Window: •Install Python2 and JDK through Chocolatey

Installation

• Android Studio• Install the Android SDK

• open SDK Manager• File->settings->Appearance & Behavior->Android SDK

• make sure the following items are checked• Android SDK Platform 28• Intel x86 Atom_64 System Image or

Google APIs Intel x86 Atom System Image• then click Apply

Page 5: React Native Setup · 2020-03-02 · •Python: both 2, 3 works for react native •React Native: npminstall –g react-native-cli •Window: •Install Python2 and JDK through Chocolatey

Android SDK Path

Page 6: React Native Setup · 2020-03-02 · •Python: both 2, 3 works for react native •React Native: npminstall –g react-native-cli •Window: •Install Python2 and JDK through Chocolatey

Environment Variable

• Windows

Page 7: React Native Setup · 2020-03-02 · •Python: both 2, 3 works for react native •React Native: npminstall –g react-native-cli •Window: •Install Python2 and JDK through Chocolatey

Environment Variable

• Mac• export ANDROID_HOME=$HOME/Library/Android/sdk export

PATH=$PATH:$ANDROID_HOME/emulator export PATH=$PATH:$ANDROID_HOME/tools export PATH=$PATH:$ANDROID_HOME/tools/bin export PATH=$PATH:$ANDROID_HOME/platform-tools

Page 8: React Native Setup · 2020-03-02 · •Python: both 2, 3 works for react native •React Native: npminstall –g react-native-cli •Window: •Install Python2 and JDK through Chocolatey

Android Virtual Device

• Open AVD Manager

Page 9: React Native Setup · 2020-03-02 · •Python: both 2, 3 works for react native •React Native: npminstall –g react-native-cli •Window: •Install Python2 and JDK through Chocolatey

Android Virtual Device

• Create Virtual Device

Page 10: React Native Setup · 2020-03-02 · •Python: both 2, 3 works for react native •React Native: npminstall –g react-native-cli •Window: •Install Python2 and JDK through Chocolatey

Android Virtual Device

• Choose any phone you like

Page 11: React Native Setup · 2020-03-02 · •Python: both 2, 3 works for react native •React Native: npminstall –g react-native-cli •Window: •Install Python2 and JDK through Chocolatey

Android Virtual Device

• Choose any system image you like

Page 12: React Native Setup · 2020-03-02 · •Python: both 2, 3 works for react native •React Native: npminstall –g react-native-cli •Window: •Install Python2 and JDK through Chocolatey

Android Virtual Device

• Click finish and see the virtual Device

Page 13: React Native Setup · 2020-03-02 · •Python: both 2, 3 works for react native •React Native: npminstall –g react-native-cli •Window: •Install Python2 and JDK through Chocolatey

Create a RN Project

• Make sure you Run as Administrator when you open Terminal• react-native init <project_name>

Page 14: React Native Setup · 2020-03-02 · •Python: both 2, 3 works for react native •React Native: npminstall –g react-native-cli •Window: •Install Python2 and JDK through Chocolatey

Run a RN project

• cd to the project floder• cd <project_name>

• Run RN project• react-native run-android


Recommended