Download as pdf or txt
Download as pdf or txt
You are on page 1of 20

React Native

React Native is an open-source UI


software framework created by Meta
Platforms, Inc.[3] It is used to develop
applications for Android[4]: §Chapter 1 ,[5][6]
Android TV,[7] iOS[4]: §Chapter 1 ,[6]
macOS,[8] tvOS,[9] Web,[10] Windows[8]
and UWP[11] by enabling developers to
use the React framework along with
native platform capabilities.[12] It is used
to develop the Android and iOS
applications at Facebook, Microsoft,
and Shopify.[13] It is also being used to
develop virtual reality applications at
Oculus.[14]
React Native

Developer(s) Meta and


community

Initial release March 26, 2015[1]

Stable release 0.72.4[2] / 14


August 2023

Repository https://github.com/facebook/rea
native

Written in JavaScript, Java,


C++, Objective-C,
Python

Platform Android, Android TV,


iOS, macOS, tvOS,
Web, Windows,
UWP, and VR

Type Application
framework

License MIT License

Website reactnative.dev (http


s://reactnative.de
v/)

History
In 2012 Mark Zuckerberg commented,
"The biggest mistake we made as a
company was betting too much on
HTML as opposed to native".[15][16]
Using HTML5 for Facebook's mobile
version resulted in an unstable
application that retrieved data slowly.[17]
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.[18]

In 2015, after months of development,


Facebook released the first version for
the React JavaScript Configuration.
During a technical talk,[19] Christopher
Chedeau explained that Facebook was
already using React Native in
production for its Group App and its Ads
Manager App.[20]

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.[4]: §Chapter 2 It runs in a
background process (which interprets
the JavaScript written by the
developers) directly on the end-device
and communicates with the
native[4]: §Chapter 2 platform via serialized
data over an asynchronous and
batched bridge.[21][22]

React components wrap existing native


code and interact with native APIs via
React's declarative UI paradigm and
JavaScript. TypeScript is often used
over JavaScript in modern React Native
applications due to its increased type
safety. [23]

While React Native styling has a similar


syntax to CSS, it does not use HTML or
CSS.[4]: §Chapter 5 [24] Instead, messages
from the JavaScript thread are used to
manipulate native views.

React Native is also available for both


Windows and macOS, which is
currently maintained by Microsoft.

Hello World example


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

1 import { AppRegistry,
Text, View, Button }
from 'react-native';
2 import React from
'react';
3
4 const HelloWorldApp =
() => {
5 const [count,
setCount] =
React.useState(0);
6
7 const incrementCount
= () => {
8
setCount((prevCount) =>
prevCount + 1);
9 };
10
11 return (
12 <View>
13 <Text>Hello
world!</Text>
14 <Text>{count}
</Text>
15 <Button onPress=
{incrementCount}
title="Increase Count"
/>
16 </View>
17 );
18 };
19
20 export default
HelloWorldApp;
21
22 AppRegistry.registerCom
ponent('HelloWorld', ()
=> HelloWorldApp);

See also
React (JavaScript library)
Multiple phone web-based
application framework
NativeScript
Xamarin
Titanium SDK
Apache Cordova
Flutter (software)
Qt (software)
Codename One
Citations
1. "React Native: Bringing modern web
techniques to mobile" (https://code.fb.c
om/android/react-native-bringing-mod
ern-web-techniques-to-mobile/) . 26
March 2015.
2. "Release 0.72.4" (https://github.com/fa
cebook/react-native/releases/tag/v0.7
2.4) . 14 August 2023. Retrieved
19 September 2023.
3. "Chapter 1. What Is React Native?" (http
s://www.oreilly.com/library/view/learnin
g-react-native/9781491929049/ch01.ht
ml) . oreilly.com. O’Reilly Media, Inc.
Retrieved 30 July 2020.
4. Eisenman 2016.
5. "Android Release for React Native" (htt
ps://code.facebook.com/posts/1189117
404435352/react-native-for-android-h
ow-we-built-the-first-cross-platform-
react-native-app/) . 14 September
2015.
6. Shankland, Stephen (March 29, 2018).
"Mozilla's radical open-source move
helped rewrite rules of tech" (https://w
ww.cnet.com/culture/mozilla-open-so
urce-firefox-move-helped-rewrite-tec
h-rules-anniversary/) . CNET.
Retrieved May 11, 2022.
7. "Building For TV Devices · React
Native" (https://reactnative.dev/) .
reactnative.dev. Retrieved 2020-10-02.
8. "React Native for Windows + macOS ·
Build native Windows & macOS apps
with Javascript and React" (https://micr
osoft.github.io/react-native-window
s/) . microsoft.github.io. Retrieved
2020-10-02.
9. "React Native for Apple TV" (https://dlo
wder-salesforce.github.io/react-native
-apple-tv/) . React Native for Apple TV.
Retrieved 2020-10-02.
10. "React Native for Web" (https://github.c
om/necolas/react-native-web/) .
GitHub. Retrieved 2019-11-06.
11. Windows Apps Team (April 13, 2016).
"React Native on the Universal
Windows Platform" (https://blogs.wind
ows.com/buildingapps/2016/04/13/reac
t-native-on-the-universal-windows-pl
atform/) . blogs.windows.com.
Retrieved 2016-11-06.
12. "Out-of-Tree Platforms" (https://reactn
ative.dev/docs/out-of-tree-platform
s) . reactnative.dev. Facebook, Inc.
Retrieved 30 July 2020.
13. "React Native Showcase" (https://react
native.dev/showcase.html) .
react.native.dev. Retrieved
2023-04-04.
14. "React Native in H2 2021 · React
Native" (https://reactnative.dev/blog/20
21/08/19/h2-2021) . reactnative.dev.
Retrieved 2021-08-20.
15. "Zuckerberg's Biggest Mistake? 'Betting
on HTML5' " (https://mashable.com/201
2/09/11/html5-biggest-mistake) .
Mashable. Retrieved 7 April 2018.
16. Zuckerberg, Mark (2012-09-12).
"Fireside Chat With Facebook Founder
and CEO Mark Zuckerberg" (https://tec
hcrunch.com/video/fireside-chat-with-
facebook-founder-and-ceo-mark-zuc
kerberg/) . TechCrunch (interview).
Retrieved 2021-08-16.
17. Warren, Christina. "Zuckerberg's
Biggest Mistake? 'Betting on HTML5' "
(https://mashable.com/2012/09/11/html
5-biggest-mistake/) . Mashable.
Retrieved 2020-10-29.
18. "A short Story about React Native" (http
s://jobninja.com/blog/short-story-react
-native/) . Retrieved 16 January 2018.
19. Christopher, Chedeau. "A Deep Dive
into React Native" (https://www.youtub
e.com/watch?v=7rDsRXj9-cU) .
YouTube. Retrieved 16 January 2018.
20. "React Native: Bringing modern web
techniques to mobile" (https://code.fac
ebook.com/posts/1014532261909640/r
eact-native-bringing-modern-web-tec
hniques-to-mobile/) . 26 March 2015.
21. "Bridging in React Native" (https://tadeu
zagallo.com/blog/react-native-bridg
e/) . 14 October 2015. Retrieved
16 January 2018.
22. "How we build React Native app: 7
things which save your development
time. Part 2" (https://blog.uptech.team/
how-we-build-apps-on-react-native-
part-2-7-things-you-should-know-to-
save-your-development-time-944533f
81c03) . Retrieved 2019-11-06.
23. "Using TypeScript" (https://reactnative.
dev/docs/typescript) . reactnative.dev.
Meta Platforms, Inc. Retrieved 14 July
2023.
24. "React Native Style" (https://reactnativ
e.dev/docs/style) . Retrieved
24 February 2021.

References
Eisenman, Bonnie (2016). Learning
React Native. O'Reilly. ISBN 978-1-
491-92900-1.

Retrieved from
"https://en.wikipedia.org/w/index.php?
title=React_Native&oldid=1177258800"

This page was last edited on 26 September


2023, at 23:14 (UTC). •
Content is available under CC BY-SA 4.0
unless otherwise noted.

You might also like