Learn Once, Write Anywhere ——Learn React Native from scratch (1) Build the environment

Learn Once, Write Anywhere ——Learn React Native from scratch (1) Build the environment

React Native is Facebook's open source framework for developing native applications using JavaScript and React. It only supported IOS at the beginning, and began to support Android at the end of last year. Compared with native applications, RN supports hot updates to facilitate iteration, and cross-platform to improve development efficiency; and H5 Compared with /Hybrid, RN uses native components and has a better user experience. If we want to talk about the disadvantages, it is that the appearance time is short, the popularity is not high, the support of some libraries is relatively rigid, and so on.
The first time I knew React Native was at an Android technology exchange meeting in Shanghai. Several great gods highly praised this technology. Coupled with the halo blessing of FaceBook, it left a deep impression on me who didn't understand much at the time.
The second time was at an event on Weibo. I won a participation award for the first time, and the prize was this book:

Now I can’t do it if I don’t want to learn, so come on.
Sneaking in during the weekend, finally freed up some time. I plan to set up the environment on Windows first (the Linux version is going to be added after the computer is upgraded).
Referring to the tutorial on the React Native Chinese forum, first install a package manager Chocolatey on Windows (similar to apt-get on Ubantu), run PowerShell as an administrator (the following commands are also the same), and type the following command:

iex ((new-object net.webclient).DownloadString('https://chocolatey.org/install.ps1'))

It seems that it should download the component package and run the script (configure the compilation environment, add dependencies, compile, copy, configure environment variables).
At the end of the run, an error was reported:
"The file install.ps1 cannot be loaded because the execution of scripts is prohibited in this system. For more information, please refer to...." I
checked on the Internet and said that it is a problem with the execution policy of Windows PowerShell. The default is "Restricted" (the execution policy does not allow any scripts to run). To run unsigned scripts written by a user and signed scripts from other users on the local computer, change the execution policy on the computer to RemoteSigned using the following command:

set-executionpolicy remotesigned

After typing the above command, and then run install.ps1, it will be fine.
Then it's time to install Python 2 using Chocolatey:

choco install python2

Install NodeJS using Chocolatey:

choco install nodejs.install

Use npm to install the React Native command-line tools (used to perform tasks such as creating, initializing, updating projects, running packaging services (packagers)):

npm install -g react-native-cli

Next is the part of AndroidStudio:
need to upgrade AS to 2.0 or above;
need JDK1.8;
need to configure the ANDROID_HOME environment variable: Android SDK;
configure the environment variables of tools and platform-tools of Android SDK (optional);

After completing these, you can try to create your first React Native Project:
In the specified path, execute the following command:

react-native init MyFirstProject

Wait for a while, as shown in the picture:

the creation is successful!
According to the prompt, you need to turn on the emulator or the USB connection device. Here, choose the real machine to run:
don’t forget to turn on the USB debugging option of the phone. After connecting, type in the command line:

adb devices

(The premise is that you have configured the platform-tools environment variable)
If it is normal, you will see the following results:

It means that your device is connected normally. Next, type the following command:

cd MyFirstProject
react-native run-android

After waiting for a while, I found an error:

The author was very confused here for a while, and I didn't find any relevant information on the Internet. Finally, I had an idea and remembered the problem of the system version.
It seems that RN will have problems running on a real machine below Android 5.0, but the author used a 4.4 machine at the beginning, and finally replaced it with a 6.0 machine, and ran again:

It worked! Although I haven't figured out the problem just now. . .
Come here first this time, next time we try to add some UI to the project to see the effect.