React Native Introduction and Getting Started

1. Introduction

[[169817]]

ReactNative.png

React Native was released by Facebook, which allows us developers to use JavaScript and React to develop our applications. It advocates component-based development, that is, React Native provides us with packaged components for developers to use, and we can even nest related components to form new components.

Using React Native, we can maintain the same core business logic code for multiple platforms (Web, Android and IOS) to create native applications.

At this stage, the experience of Web APP still cannot reach that of Native APP, so Facebook emphasizes "learn once, write everywhere". On the front end of the application, we use js and React to develop UIs for different platforms, and the lower-level core modules write reusable business logic codes to improve application development efficiency.

The design concept of React Native is to have the user experience of Native while retaining the development efficiency of React.

React Native: Bringing modern web techniques to mobile, published by React Native project member Tom Occhino, describes the design concept of React Native in detail.

Occhino believes that although Native development costs are higher, it is still necessary at this stage because the user experience of the Web cannot surpass Native:

1. Native controls provide a better experience;
2. Native has better gesture recognition;
3. Native has a more suitable thread model. Although Web Workers can solve some problems, image decoding and text rendering still cannot be multi-threaded, which affects the smoothness of the Web.

Notice:

Currently, react native only supports iOS 7 and above on iOS, and only supports Android 4.1 and above on Android.

2. Brief description of the framework

reactnative super simple framework.png

1. React: Write React-based code on different platforms, "Learn once, write anywhere".
2. Virtual DOM: Compared with the DOM (Document Object Model) in the Browser environment, Virtual DOM is a lightweight representation of the document in memory. It can generate UIs for different platforms through different rendering engines. JS and Native communicate through Bridge.
3. Web/iOS/Android. (All now available)

3. What is React and Native

1. React

React is a JS library developed by Facebook.

React is actually a JavaScript framework for building "predictable" and "declarative" web user interfaces, which has enabled Facebook to develop web applications faster.

For more detailed information, please refer to the article: http://www.jianshu.com/p/ae482813b791

For more information about React, please refer to the article: http://www.ruanyifeng.com/blog/2015/03/react.html

2.Native

The understanding here is that the Native value in ReactNative refers to the Native application.

Native App is a third-party application based on the local operating system of smartphones such as iOS, Android, WP and written and run using native programs, also called local app.

4. Personal learning route

1. Environment construction and initialization project

2. Learn and apply flex layout and css style simply (originally without basic knowledge)

3. es6 syntax (I am a pure iOS developer and have no JavaScript foundation. I can only have a simple understanding and learn while using it)

4. Simple writing of components and page refresh

5. Integrate into native projects and interact with native

6. Network layer, model layer and data processing

5. Recommended websites/articles for study reference

ReactNative Chinese website: http://reactnative.cn/docs

Jiang Qingqing's React Native topic: http://www.lcode.org/react-native/

ES6 Introduction: http://es6.ruanyifeng.com/#docs/class

Introduction to Flex layout: http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html?utm_source=tuicool

This is the first step. Hope you can support us.