A Guide for trouble shooting react native errors

Well , while you download react native project from somewhere and try to run it is whole different game of errors and bugs , here I am trying to compile basics steps to try.

Here official trouble shooting page : https://reactnative.dev/docs/troubleshooting

1. know the folder structure : https://medium.com/habilelabs/best-folder-structure-for-react-native-project-a46405bdba7
2. Know your npm version : npm -v
3. Know you node version : node -v
4. Know your react native version : npm react-native -v
5. remember there are 4 key folders : android , ios , nodejs, and root folder.
6. package.json in root folder contains all information about packages to be installed
7. Run : npm install , inside root directory.
8. if this installed successfully : npx react-native run-android
9. watch out any error at this point

Getting started with React native on windows in late 2021 in just 20 minutes !!!

So, there are lot of react native articles available online so won't be wasting your time and my time. But basically mobile development is becoming too complex. And there is web development as well.

So, Facebook guys came up with react native , write once deploy everywhere !!! Android , iOS , web !!!

This is more advance then earlier attempt made for cross development like Xamrine or phonegap. 

Currently flutter is closest competitor led by google, let's see what happens in future. But currently react native is most popular , see below image.

 

Note that you can start with expo CLI or using react native CLI , I would highly advice start with react native CLI. Just forget anything like expo CLI exists.

Read this if you don't believe me : https://medium.com/nerd-for-tech/expo-v-s-react-native-cli-what-to-choose-and-what-to-stay-away-from-85afc81597bc

These are quick steps to start with react native. 

Prerequisites :

* Note that you need a good machine if you are doing android development like 8GB RAM , 256 GB SSD, 4 core processor.

* a good broadband internet connection

1) Install nodejs : https://nodejs.org/en/download/

when asked about Chocolatey , install it.

2) Follow this link : https://reactnative.dev/docs/environment-setup ( keep this article open )

choco install -y nodejs.install openjdk8

Remember : start CMD with administrator mode.

3) Download and install android studio : https://developer.android.com/studio

4) Set up all the path variables described in above article.

5) Create a folder.

6) Start a new react native project called AwesomeProject : npx react-native init AwesomeProject

7) Prepare your phone for debugging ( note : don't waste your time in setting up virtual machines , this is 2021 and you must have android phone , if you want to be developer. )

https://developer.android.com/studio/run/device

Basically unable developer options in your device by tapping build version 7 times , and then turn on USB debugging in developer options.

8) Run Metro Server : npx react-native start

9) Run your react native app on android phone : npx react-native run-android

10) Run your react native app on android phone : npx react-native run-ios

Congratulations !!! you have set up your system for react native.

Now when you are developing code don't forget to create a repository on github to maintain your code. Read article on this blog for quick start on github.

If you face any difficulty let me know in comments.

Note : if you are using "yarn" just write yarn instead of npx.

some helpful links:

1) https://stackoverflow.com/questions/58120990/how-to-resolve-the-error-on-react-native-start