1, enter the Http://nodejs.cnnodejs Chinese network, download the NODEJS installation package that is consistent with its own environment
2. After the installation package is downloaded, double-click to install
Win Platform students note that the installation process to turn off anti-virus software and a variety of security tools
3, after the installation is complete, open the command line tool, check whether the installation is successful, execute the following command:
$ node -v
The result of the command execution is the current node version, the current version of the author is:
4, check if NPM is installed successfully,
NPM is the node package management tool that needs to be used to install additional node packages
Enter the following command on the command line:
$ npm -v
The result of the command execution is:
3.10.10
Yarn
Yarn is a Facebook-based package management tool that works just like NPM. But yarn has more useful features:
Yarn caches every package it downloads, so you don't need to repeat the download. It can also parallelize operations to maximize resource utilization, so the installation is faster than ever
Yarn verifies the integrity of the package with a checksum before the code for each installation package executes.
Yarn is installed with a well-formed, yet concise lockfile and an exact algorithm to ensure that the installation process running on one system will run the same way on other systems
Network adaptation to a single request failure does not cause installation to fail and retries when a request fails
Installing yarn
Visit yarn website and download the installation package of the response platform for installation
Using yarn
When installed, other tools automatically use yarn for acceleration.
Of course, before installing, you can first check if you have already installed yarn, if the pattern appears, the description has been installed.
Yarn-v look at the current version
Installing the Create-react-native-app command-line tool
Create-react-native-app is a tool that synthesizes the creation of reactnative projects and does not require configuration, which greatly simplifies the process of getting started. Specific content, you can go to its github.com homepage to browse.
Installing Create-react-native-app requires NPM, and in any directory, enter the following command to create a reactnative project in that directory.
Note that if the Crna command-line tool is not installed, running the command directly will report such an error:
So we have to install the command line tool, also called scaffolding.
Because the NPM server outside the network, coupled with the reasons for the slow speed, this load will be very full, we do not dry.
, the installation is complete, I seem to be a bit fast network today Ah, installed 30s.
Create a reactnative Project
Templates for reactnative projects need to be created through the Create-react-native-app tool. The creation method is as follows:
1. Enter the folder where the Reactnative project is stored via the command line.
2, under this folder, execute the following command:
$ create-react-native-app myapp
MyApp is the project name and can be replaced with other characters, but must be lowercase
Installation process takes 1-5 minutes, if you want to increase the speed of installation, you can install yarn, details see yarn official website
The following is the successful installation of the author:
This process is really long, I have waited for 10 minutes. This process you don't doubt the time, really is this.
If you are impatient in this process, you can download our essential tools first: 1. Simulator, here I recommend night God Simulator. 2.Expo, this is a device that can be installed directly on the phone or in the simulator for testing projects.
Simulator will be installed, install the simulator, we configure the parameters:
To reduce our memory overhead, we put the configuration down a bit. The memory of the big local tyrants doesn't matter!
Run a preview project
1, after the project is created, you can start the project and start development and commissioning.
To start the project, first use the command line tool to enter the project directory, and then run the following command
$ yarn start
After the project is started, a QR code and a local link are generated, which allows you to preview the effect of the project operation with this QR code or local link.
This is what represents your project has run up, how to see the effect? Then look at the English characters, hint: Want to preview your app to load out what kind of hanging, then use the Expo App scan the Code tool sweep it, you can see your project is running up what kind of hanging!
Expo is what, how to find the Expo and install Expo it? To the Expo official website Https://expo.io A lot of people online Download Expo There are problems, and also someone added I want to, here if you have a problem, you can directly visit the following I give the expo download link, direct download!
Press A to open the project on the Android or simulator development device
Show QR code by q
Press R to reload the resource bundle
Press R to reload the resource bundle and clearly cache
OK, here's a little information for you:
2, after the start of the project, the need to install the Expo app on the phone, using the Expo app to preview the development of the Reactnative app run.
Here's how to install Expoapp:
iOS platform: Search the Expo client in AppStore,
Under Android platform, Access this link: http://expo.io/--/api/v2/versions/download-android-apk Download the installation package and install it, you need to give this app full permissions during installation.
3,expo app after the phone-side installation is complete, open the Expoapp, through its scanning QR code function, scan the generated QR code, you can preview the app project in the app
4, the operation effect of the new project is:
Note: There are two ways to look at the app you've developed on the Expo: 1. You can scan the code on your phone for 2. Copy the exp://xxxx.xx.xx.xx link, and on project, you can see the item,
Write code in the IDE to see the effects!
Cooked to say, 工欲善其事, its prerequisite, here I recommend you to use the VS Code editor to knock the codes, the effect is very cool!
Find the project we just created, have vs code open it, and write the code!
After I modified the content, the content of the app also changed!
Using vs code to write RN, I recommend you install a few plug-ins, the purpose of installing plug-ins for more efficient development
Well, to this step, our app even if it is run up, if you patiently and I learned here, so congratulations, you are very good, because I first engaged in this time, engaged for two days, or a face blind!
Follow-up articles continue to update, please look forward to!
Article for the author original, reproduced please indicate the source.
Take you from the zero-learning reactnative development of cross-platform app Development (i)