Today put react native environment to complete, and then run a small demo to try.First Environmental configuration Hello World Summary
According to the above study article, I basically completed, but in the configuration process encountered 2 problems, need to end. node is installed
Since I installed react-native befo
The dimensions in the React native are non-units, representing logical pixels that are independent of the device pixel density.ImportReact, {Component} from' React ';Import {Appregistry,View} from' React-native ';ClassFixeddimensionsbasicsExtendsComponent {render () {Return
Just started the RN, met a lot of pits, record. Go to a problem and see issue! on GitHub.
Start command react-native Run-ios error1.: xcrun:error:unable to find Utility "instruments", not a developer tool or in PATHSolution Solutionssudo xcode-select -s /Applications/Xcode.app/Contents/Developer/Just a little bit of a run again.2. Bundling failed:Error:Unable to resolve module '. /
React NativeA set of cross-platform scenarios based on the node. JS model environment, using the react UI environment.The real-world scenario might be a node. JS-based model environment, based on each platform's UI environment.iOS Environment installation1. Install NVMHttps://github.com/creationix/nvm#installation2. Install nodeNVM Install 5.3.0NVM Alias Default node3. Installing WatchmanBrew Install Watchm
(1)Installation: NPM install-g REACT-NATIVE-CLIREACT-NATIVE-CLI is a command-line tool for developing react nativeThe above line of code will help you install the react-native command in terminal. Of course, you only need to run t
Environment constructionEnvironmental construction can refer to the RN official website, also can refer to the Chinese version: http://reactnative.cn/docs/0.45/getting-started.htmlIf you want to see the original installation process, you can look at the official address, this article is only my personal practice, and is limited to the window platform.Official address: https://facebook.github.io/react-native
01 Fundamentals and Development environment constructionA brief introduction to the React native architecture and principles of "recording" (16 minutes)"Recording" MacOS iOS environment build (19 minutes)"Recording" MacOS Android Environment build (17 minutes)"Recording" Windows Android Environment build (10 minutes)Use and precautions for "recording" Android devices (8 minutes)02JavaScript, Node, ES6 Found
want to use RN to make a RSA (Asymmetric encryption) LoginThe basic process is to generate RSA on the server side, the "public key" to the client, and then the client with "public key" encryption information sent to the server, the service end with the private key decryption.The process is not complicated, the problem is that Nodejs and RN are prepared to use JS to do RSA encryption, originally wanted to do with Node-rsa, but do not understand how it set public key encryptionSo directly to do No
TextInputis an underlying component that allows the user to enter text. It has a property named onChangeText , which accepts a function that is called when the text changes. There is also a property named onSubmitEditing , which is called after the text is committed (the user presses the Submit key on the soft keyboard).Import React, {Component}From' React ';Import {appregistry, Text, TextInput, View}From'
ScrollViewis a generic scrollable container where you can put multiple components and views, and these components do not need to be of the same type. ScrollView not only scrolls vertically, but also scrolls horizontally ( horizontal set by properties).Import React, {Component} from ' React '; import{appregistry, ScrollView, Image, Text, View} from ' React-
/*** Component Drawerlayoutandroid (Implementation of the Android drawer)The Drawerlayoutandroid properties and methods of this article compare the whole point* */Import react,{purecomponent} from ' React 'Import {view,drawerlayoutandroid,text,dimensions,textinput,touchableopacity} from ' React-native 'Class Drawerlayo
working principle:Basically similar, js-native Bridge and front-end rendering framework, but the use of frame technology is not the same;WeexAli's early development of a project through the JSON data description native rendering Weapp and vue.js this excellent front-end open source MVVM framework and deep integration; HTTPS://GITHUB.COM/WEEXTEAM/ARTICLE/ISSUES/32React Native:http://www.jianshu.com/p/978c4bd
1. New Project2. Apply for the Gold Key1. Sign up for the gold developer2. Gold Personal Center Application key3. Fill in the informationNow you need to write SHA1 and PackageName.SHA1 requires a project to be packaged to get to, package the projectGo to java->bin directory keytool-list-v-keystore E:\RN\ShareUmbrella\android\app\xx.keystore---Back to my directoryYou can see the SHA1PackageName into the project Android\app\src\main can see androidmanifest.xml inside the package= "package name" in
-in Installation
Where static code check there are some problems, please see the following great God's article, wrote very detailed, there are questions we will discuss.
Static code checking plug-in configuration
Here's what I did when I opened my project with sublime:
At this time we want to run our project, if you have installed a plugin above (Terminal), press Command+shift+t, will open the terminal, directly into your project directory.
No installation does not matter, open the terminal
IOS react Native Flexbox Detailed and data collation,
# Preface
Learning this series of content needs to have a certain HTML development base, no basic friends can go to HTML learning
I contact react Native time is not particularly long, so the content and nature of the understanding may be biased, in the study if t
application should be put together to write the above two, here just for the following and the new and old two ways to separate.In react native, the implementation style is just a small subset of the CSS, which uses the flex layoutThe idea of implementation is the same as above, but due to the view component in react native
The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion;
products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the
content of the page makes you feel confusing, please write us an email, we will handle the problem
within 5 days after receiving your email.
If you find any instances of plagiarism from the community, please send an email to:
info-contact@alibabacloud.com
and provide relevant evidence. A staff member will contact you within 5 working days.