React Native

Print Print
Reading time 4:57

React Native
React-icon.svg
Developer(s)Facebook and community
Initial releaseMarch 26, 2015; 6 years ago (2015-03-26)[1]
Stable release
0.64.0 / March 12, 2021; 3 months ago (2021-03-12)[2]
Preview release
0.64.0-rc.4 / March 2, 2021; 3 months ago (2021-03-02)[2]
Repositoryhttps://github.com/facebook/react-native
Written inJavaScript, Java, C++, Objective-C, Objective-C++, Python
PlatformAndroid, Android TV, iOS, macOS, tvOS, Web and Windows
TypeApplication framework
LicenseMIT License
Websitereactnative.dev

React Native is an open-source mobile application framework created by Facebook, Inc.[3] It is used to develop applications for Android,[4]Android TV,[5]iOS, macOS,[6]tvOS,[7]Web,[8]Windows[6] and UWP[9] by enabling developers to use React's framework along with native platform capabilities.[10]

History

In 2012 Mark Zuckerberg commented, "The biggest mistake we made as a company was betting too much on HTML as opposed to native".[11] Using HTML5 for Facebook's mobile version resulted in an unstable application that retrieved data slowly.[12] He promised Facebook would soon deliver a better mobile experience.

Inside Facebook, Jordan Walke found a way to generate UI elements for iOS from a background JavaScript thread, which became the basis for the React web framework. They decided to organize an internal Hackathon to perfect this prototype in order to be able to build native apps with this technology.[13]

After months of development, Facebook released the first version for the React JavaScript Configuration in 2015. During a technical talk,[14] Christopher Chedeau explained that Facebook was already using React Native in production for their Group App and their Ads Manager App.[15]

Implementation

The working principles of React Native are virtually identical to React except that React Native does not manipulate the DOM via the Virtual DOM. It runs in a background process (which interprets the JavaScript written by the developers) directly on the end-device and communicates with the native platform via serialized data over an asynchronous and batched bridge.[16][17]

React components wrap existing native code and interact with native APIs via React’s declarative UI paradigm and JavaScript. This enables native app development for whole new teams of developers, and can let existing native teams work much faster.[18]

While React Native styling has a similar syntax to CSS, it does not use HTML or CSS.[19] Instead, messages from the JavaScript thread are used to manipulate native views. React Native also allows developers to write native code in languages such as Java or Kotlin for Android and Objective-C or Swift for iOS, which makes it even more flexible.

Hello World example

A Hello, World program in React Native looks like this:

import React from 'react';
import { AppRegistry, Text } from 'react-native';

const HelloWorldApp = () => <Text>Hello world!</Text>;
export default HelloWorldApp;

// Skip this line if using Create React Native App
AppRegistry.registerComponent('HelloWorld', () => HelloWorldApp);

// The React native code can also be imported from another component with the following code:
import HelloWorldApp from './HelloWorldApp';

See also

  • Multiple phone web-based application framework
  • NativeScript
  • Xamarin
  • Appcelerator Titanium
  • Apache Cordova
  • Flutter (software)
  • Codename One

References

  1. ^ "React Native: Bringing modern web techniques to mobile". 26 March 2015.
  2. ^ a b "Releases – Facebook/React". GitHub.
  3. ^ "Chapter 1. What Is React Native?". oreilly.com. O’Reilly Media, Inc. Retrieved 30 July 2020.
  4. ^ "Android Release for React Native". 14 September 2015.
  5. ^ "Building For TV Devices · React Native". reactnative.dev. Retrieved 2020-10-02.
  6. ^ a b "React Native for Windows + macOS · Build native Windows & macOS apps with Javascript and React". microsoft.github.io. Retrieved 2020-10-02.
  7. ^ "React Native for Apple TV". React Native for Apple TV. Retrieved 2020-10-02.
  8. ^ "React Native for Web". Retrieved 2019-11-06.
  9. ^ Windows Apps Team (April 13, 2016). "React Native on the Universal Windows Platform". blogs.windows.com. Retrieved 2016-11-06.
  10. ^ "Out-of-Tree Platforms". reactnative.dev. Facebook, Inc. Retrieved 30 July 2020.
  11. ^ "Zuckerberg's Biggest Mistake? 'Betting on HTML5'". Mashable. Retrieved 7 April 2018.
  12. ^ Warren, Christina. "Zuckerberg's Biggest Mistake? 'Betting on HTML5'". Mashable. Retrieved 2020-10-29.
  13. ^ "A short Story about React Native". Retrieved 16 January 2018.
  14. ^ Christopher, Chedeau. "A Deep Dive into React Native". YouTube. Retrieved 16 January 2018.
  15. ^ "React Native: Bringing modern web techniques to mobile". 26 March 2015.
  16. ^ "Bridging in React Native". 14 October 2015. Retrieved 16 January 2018.
  17. ^ "How we build React Native app: 7 things which save your development time. Part 2". Retrieved 2019-11-06.
  18. ^ "How React Native can Empower App Development Process?". 15 February 2019. Retrieved 15 February 2019.
  19. ^ "React Native Style". Retrieved 24 February 2021.

By: Wikipedia.org
Edited: 2021-06-18 12:26:09
Source: Wikipedia.org