If you are interested in developing mobile apps with React Native but have no experience, this guide will let you start.
Prerequisites :
Android Studio :
Just download and install android studio from the link below.
https://developer.android.com/studio
JAVA SE Development Kit:
Again, download and install jdk that matches your system from the link below.
Java SE 13 - DownloadsAdding Environment Variables
After you installed jdk add “C:\Program Files\Java\jdk-13.0.2\bin” at the end of your “Path” variable in environment variables.
Create another variable in environment variables named “JAVA_HOME” with the path “C:\Program Files\Java\jdk-13.0.2”
Your address may differ depending on your installed JDK version.
Check if path variables contain this folder and if not, add following with your username.
C:\Users\Your_Username\AppData\Local\Android\Sdk\platform-tools
Installing React Native
Install react-native with the command below
npm i -g react-native
Creating React Native Project
Go to the directory you want to create project in and create project with the command below
react-native init Example
When we type react-native init Example to command line it will create a folder named Example and create the project inside it. Open your project after it is created.
— — — — — — — — — — — — — — — — — — — — — — — — — — — — — — —
This is our folder structure. App.js is our initial rendered file. So we are going to start from there.
Building Project in Android Studio
Before we try to run our application in our emulator, we need our npm modules and javascript code to be built so android can run it.
Open android studio and select the android folder in your project, open it.
If you don’t want to use emulator but your android phone,you can follow our article about connecting over usb debugging with cable or wifi without cable here.
Creating Virtual Device
Pick any device and click next
You can create device with the default configurations by clicking finish.
Open your project directory in terminal and run this command
react-native run-android
If you get any of these errors change directory into android and run clean command
cd android
./gradlew clean
If you run this command in android studio terminal, just run
gradlew clean
After cleaning project if you still get these errors, just re run the react-native run-android command and it will work eventually.
* Task :app:packageDebug FAILED
java.io.IOException: Unable to delete directory ……
* What went wrong:
Execution failed for task ‘:app:compileDebugJavaWithJavac’
Thank you for reading. You can follow us to learn more about react & react native development.
Feel free to ask anything about this article if you get any errors. You can contact any of us on linkedin.
MTA Team:
Ali Gümüş Tosun - Semih Sevincli - Aslancan Yılmaz - Burak Arıcı
LinkedIn Accounts:
Ali Gümüş Tosun - Semih Sevinçli - Aslancan Yılmaz - Burak Arıcı
By MTA Team on .
Exported from Medium on June 23, 2020.
Top comments (1)
What is the difference between Layout and View in React Native?
find links for their APIs
Layout: reactnative.dev/docs/layout-props
View: reactnative.dev/docs/view-style-props
Thanks in advance