Creating and opening your react-native project in Android studio (for Mac)
I’m going to share exactly how to get your app up and running. There are a lot of places to get lost and confused on your first project, I will cover those too.
First, I will share my biggest mistake that cost me the most time and energy: When I first opened my project in Android studio, I opened the entire project folder. Big mistake!!! Android studio only wants the Android folder that is inside of your main project folder. Because of this mistake I tried for two weeks to manually install and adjust gradle settings and couldn’t get it right. I did, however, learn a hell of a lot about Android studio settings.
So, please for the love of god only open your Android folder in Android studio. Then Android studio will do a beautiful, flawless automatic install of all your gradle settings. It’s normal for Android studio to show an error window during installation. The important thing is that Android studio also provides the solution for that error in the same window. Click on the suggested solution and it is automatically fixed.
CREATE YOUR REACT-NATIVE PROJECT:
1. Open your terminal. Separately copy/paste the following and press enter:
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
brew install node, brew install watchman,
react-native init your_project_name
2. cd to your project directory.
npm install -g react-native-cli. Press enter.
3. Download java (I’m running java 8) There are two versions. Either one will work.
4. Open a new terminal window. Type nano .bash_profile and press enter.
Copy and paste the following:
export ANDROID_HOME=$HOME/Library/Android/sdk export PATH=$PATH:$ANDROID_HOME/tools export PATH=$PATH:$ANDROID_HOME/platform-tools
Press control x (NOT COMMAND x!, another mistake that cost me a lot of time) to exit. Type y for yes and press enter. Your changes should be saved.
10. Always use your real device for testing! To do this, enable USB debugging on your phone (check youtube, it’s very easy). Connect your phone to your macbook with your usb cable. In terminal type:
react-native run-android
Be patient. It takes quite a while to load the app onto your phone. After this you will be able to open the project on your phone without it connected to your macbook. After it finishes loading, open your phone screen and it will open the app. Be patient again, the app takes awhile to open the first time.
11. Follow the steps to install android studio here:
12. Open android studio. Click “Open an existing Android Studio project”
Open THE ANDROID FOLDER INSIDE YOUR PROJECT FOLDER ONLY!!!!!
That’s it! It took me a lot of mistakes and lots of hopeless nights (Android studio setup) to learn how to do this the right way. I hope somebody out there appreciates that I’m sharing this information.
Please clap 50 times if you find this useful. Thanks!
