1. Installing Java on your PC
First, you need to ensure that Java is installed. One way to check if Java is installed is by running the command "java --version" in the terminal.
If the output shows a version of OpenJDK, such as "openjdk version "11.0.11" 2021-04-20", then Java is installed and ready to use.
openjdk version "11.0.11" 2021-04-20 OpenJDK Runtime Environment (build 11.0.11+9-Ubuntu-0ubuntu2) OpenJDK 64-Bit Server VM (build 11.0.11+9-Ubuntu-0ubuntu2, mixed mode)
However, if the output shows "command not found", then Java is not installed on your computer and you will need to install it. To install Java, you can use the command "sudo apt install default-jre" in the terminal. This command installs the default Java runtime environment on Ubuntu-based systems.
sudo apt install default-jre
You can install the NODE JS using the below command
sudo apt install nodejs
After installation check, if it is installed properly or not using the below command
2. Installing Android Studio
We don't use Android Studio in the projects but we need ADB (Android Debug Bridge ) to communicate with android devices.
To install ADB (Android Debug Bridge) on your computer, you need to download Android Studio from the link developer.android.com/studio. Once the download is complete, extract the .tar.gz file using the command
tar -xzf downloaded_file.tar.gz
Then, open the terminal and navigate to the android-studio/bin directory using the command
cd android-studio/bin. Next, run the command
studio.sh to start the installation process. This may take some time to complete.
cd android-studio cd bin ./studio.sh
Once the installation is finished, close the Android Studio app. To check if ADB is installed correctly, open the terminal and run the command
adb --version. If you see the version number, ADB is installed and ready to use.
If the command is not found, you need to set the environment variables. Based on your shell, open the .bashrc or .zshrc file and add the following line:
Make sure to change the path if Android Studio was installed in a different location.
3. Creating the first App
Open your terminal and use the below command to create the project in React Native
npx react-native init Awesome01
npx: Node Package Execute
Awesome01: Project Name
To enable display on your Android device's screen, follow these steps:
Open the settings app on your device.
Go to the "About Phone" section.
On Redmi devices, tap on the "MIUI version" option repeatedly (5 times) until you see a message that says "You are now a developer."
Go back to the main settings menu, and you should now see a new option called "Developer Options."
Connect your Android device to your PC via a USB cable.
In the Developer Options menu on your device, enable the "USB debugging" option and "File Transfer" option
Now, you should be able to display the screen of your android device on your computer.
To check wheater your mobile is connected to your PC or not open the terminal and type
adb devices, if you can see the devices now you are good to go.
If your Android device has some optimizations for the native Google Android operating system, it is recommended to turn off MIUI optimization (for Redmi devices) to ensure proper functionality when using ADB. To do this, follow these steps:
Go to the "Developer Options" menu on your device.
Look for the "MIUI optimization" option and turn it off.
Restart your device to ensure the changes take effect.
It's important to note that the exact steps may vary depending on your device's model, if your device is not Redmi follow the guidelines specific to your device. After turning off any optimization, reboot your device to ensure that the changes take effect.
Open the project which you have creates earlier and create a new file with the name
local.properties in android folder and add below mentioned path of andorid sdk
sdk.dir = ~/Android/Sdk
Please note that in case you have installed android studio in any other location other than the default location, the path will be different.
Use the below command to run the react-native app
npx react-native start
The process of creating an app will take some time to create the App.
If you want to experiment with this, change the default text in App.tsx and then test the app on your device.