Product
Introducing License Enforcement in Socket
Ensure open-source compliance with Socket’s License Enforcement Beta. Set up your License Policy and secure your software!
react-native
Advanced tools
React Native is an open-source mobile application framework created by Facebook. It is used to develop applications for Android, iOS, Web, and UWP by enabling developers to use React along with native platform capabilities. It allows for the development of mobile apps using JavaScript and React, offering a rich mobile UI library and tools to deliver a native app experience.
UI Components
React Native provides a set of built-in core components like View, Text, and Image that you can use to build your app's UI. These components are pre-styled and ready to use, making it easy to develop complex UIs.
import { View, Text } from 'react-native';
function HelloWorldApp() {
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
<Text>Hello, world!</Text>
</View>
);
}
Native Modules
Native Modules allow you to write modules in native code that can be called from JavaScript. This is useful for accessing platform-specific functionality that is not covered by the built-in React Native components.
import { NativeModules } from 'react-native';
const { CalendarModule } = NativeModules;
CalendarModule.createCalendarEvent('testName', 'testLocation');
Navigation
Navigation is essential for mobile apps. React Native can integrate with libraries like React Navigation to provide a way to navigate between screens.
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
const Stack = createStackNavigator();
function App() {
return (
<NavigationContainer>
<Stack.Navigator initialRouteName='Home'>
<Stack.Screen name='Home' component={HomeScreen} />
<Stack.Screen name='Profile' component={ProfileScreen} />
</Stack.Navigator>
</NavigationContainer>
);
}
Flutter is Google's UI toolkit for crafting beautiful, natively compiled applications for mobile, web, and desktop from a single codebase. It is similar to React Native but uses Dart instead of JavaScript. Flutter provides its own widgets, which are drawn by the framework's own graphics engine.
Ionic is a popular framework for building hybrid mobile applications using web technologies like HTML, CSS, and JavaScript. It differs from React Native as it focuses on web technologies and uses Cordova or Capacitor to access native device features.
NativeScript is an open-source framework for developing truly native mobile applications using JavaScript, TypeScript, Vue.js, or Angular. It provides direct access to native APIs and performance similar to React Native, but it allows for a broader choice of frameworks for building the UI.
Learn once, write anywhere:
Build mobile apps with React.
React Native brings React's declarative UI framework to iOS and Android. With React Native, you use native UI controls and have full access to the native platform.
React Native is developed and supported by many companies and individual core contributors. Find out more in our ecosystem overview.
React Native apps may target iOS 13.4 and Android 6.0 (API 23) or newer. You may use Windows, macOS, or Linux as your development operating system, though building and running iOS apps is limited to macOS. Tools like Expo can be used to work around this.
Follow the Getting Started guide. The recommended way to install React Native depends on your project. Here you can find short guides for the most common scenarios:
The full documentation for React Native can be found on our website.
The React Native documentation discusses components, APIs, and topics that are specific to React Native. For further documentation on the React API that is shared between React Native and React DOM, refer to the React documentation.
The source for the React Native documentation and website is hosted on a separate repo, @facebook/react-native-website.
Upgrading to new versions of React Native may give you access to more APIs, views, developer tools, and other goodies. See the Upgrading Guide for instructions.
React Native releases are discussed in this discussion repo.
The main purpose of this repository is to continue evolving React Native core. We want to make contributing to this project as easy and transparent as possible, and we are grateful to the community for contributing bug fixes and improvements. Read below to learn how you can take part in improving React Native.
Facebook has adopted a Code of Conduct that we expect project participants to adhere to. Please read the full text so that you can understand what actions will and will not be tolerated.
Read our Contributing Guide to learn about our development process, how to propose bugfixes and improvements, and how to build and test your changes to React Native.
You can learn more about our vision for React Native in the Roadmap.
We have a list of good first issues that contain bugs which have a relatively limited scope. This is a great place to get started, gain experience, and get familiar with our contribution process.
Larger discussions and proposals are discussed in @react-native-community/discussions-and-proposals.
React Native is MIT licensed, as found in the LICENSE file.
React Native documentation is Creative Commons licensed, as found in the LICENSE-docs file.
v0.75.0
null
for optional but not nullable arguments. (67b9628af5 by @rubennorte)class
to ForwardRef
component (401f2fbb14 by @retyui)TouchableOpacity
from JS class
to ForwardRef
component (3d00549399 by @retyui)LongLivedObjectCollection::get
accept a Runtime reference as parameter. (86a52cc2dc by @fabriziocucci)LongLivedObject
constructor accept a Runtime
reference. (3706bf077e by @fabriziocucci)ReactViewBackgroundDrawable
in favor of CSSBackgroundDrawable
(d7766fa927 by @NickGerleman)android:supportsRtl="true"
for RTL layout (82c6f8a580 by @NickGerleman)TurboModule
instead (73b4d67a78 by @arushikesarwani94)ReactJsExceptionHandler
param from constructor and providing a default private implementation (fe7e7a015f by @alanleedev).create()
changed to take an additional parameter of type PausedInDebuggerOverlayManager
(nullable) (1d26907ca4 by @motiz88)getSurfacePresenter
and getModuleRegistry
(f19371f28d by @cipolleschi)RCTRedBox
access through RCTBridge
(b5db214d2a by @realsoelynn)Image.getSize/getSizeWithHeaders
method returns a promise if you don't pass a success
callback (2c1bcbac81 by @retyui)ReactNativeApplication.[enable,metadataUpdated]
CDP messages for reading host metadata (aced4072cf by @huntie)react-devtools
standalone app (430dd0be26 by @hoxyq)remove
methods for Linking.addEventListener
and AccessibilityInfo.addEventListener
Jest mocks (2483c63017 by @levibuzolic)requestIdleCallback
and cancelIdleCallback
in the new architecture (abfadc6083 by @robik)AppRegistry.setRootViewStyleProvider
(dbdd4da14f by @acoates-ms)Header
methods (028615180b by @retyui)Image
prop resizeMultiplier
to help increase quality of small images on low DPI devices (b6c3433537)ReactMarkerConstants.CONTENT_APPEARED
support on Android in bridgeless mode. (5da9fdf8f1 by @Kudo)onUserLeaveHint
support into ReactActivityDelegate
(3cf6c64a80 by @behenate)onUserLeaveHint
support into ReactActivityDelegate
(6450d08187 by @behenate)ReactNativePodsUtils.spm_dependency
(f903f34837 by @mfazekas)Animated
components (452373b5bf by @yungsters)Pressable
component. (cfa784c5ce by @Zahoq)StyleSheet.compose
(34331af9ce by @yungsters)--experimental-debugger
launch flow (b1bb0bee41 by @motiz88)act()
(5a8327857b by @yungsters)console
object (949296571b by @motiz88)no-string-refs
is now a lint error (387250112e by @yungsters)react@18.3.1
(abb7070a51 by @yungsters)Share.share()
's argument types to be more explicit. (8b53d41a88)mockComponent
now also mocks name
(5062c5256e by @yungsters)AlertFragment
dialog builder to use androidx.appcompat
(1/2) (297ded90aa)AlertFragment
dialog builder to use androidx.appcompat
(2/2) (600d3f6ff1)openDebugger()
method on DevSupportManager
(b309af79e8 by @motiz88)useDevSupport
now is configurable by ReactNativeHost. (d195fd0c06 by @javache)DevInternalSettings
from DevSupportManagerBase
(52cec1e798 by @Kudo)DevServerHelper
(a1e8118541 by @huntie)mapbufferjni
via prefab. (c73e22142e by @tomekzaw)handleRemoveView
function in ReactViewGroup.java
to ignore calls for Views
that are not children of this ViewGroup
(0d7a92b551 by @bartlomiejbloniarz)onprogress
event for XMLHttpRequest
even when the Content-Length
header is missing in the response headers (457d14bd1b)customizeRootView
from RCTRootViewFactory
(8956869792 by @Kudo)DEFINES_MODULE
for React-jsinspector.podspec (4e6186555e by @Kudo)foregroundInactive
window when there are no foregroundActive
windows in RCTKeyWindow (42ceacd281 by @cipolleschi)notifyObservers
straight to RCTEventDispatcher.mm
. (f5c888c2d7 by @WoLewicki)<ImageBackground/>
component (09c903c439 by @retyui)launchId
query param for /debugger-frontend
is no longer generated automatically for each /open-debugger
call. Caller of /open-debugger
is now responsible for generating the launchId
, which will be passed along to /debugger-frontend
. (b7de916664 by @EdmondChuiHW)react-native/dev-middleware
: Remove non-standard faviconUrl
field from CDP /json
response (df19e597e3 by @huntie)tvParallaxProperties
prop from TouchableOpacity
& add missing focusable
, rejectResponderTermination
props (0a0cd6517f by @retyui)NativeAnimationsDebugModule
(already not Public API) (95f7a5c597 by @yungsters)fontWeight
normalization for TextInput component (15f27bc299 by @NickGerleman)Props.h
created from codegen missing default initializers in C++ struct
(639d890dff by @alanleedev)collapsableChildren
prop (7b44c8d1d0 by @NickGerleman)NativeState
methods to the WithRuntimeDecorator
class. (218ea5d44c by @bartlomiejbloniarz)mountingOverrideDelegates
(358fe46969 by @WoLewicki)adjustFontSizeToFit
when used without numberOfLines
(b236e154a1 by @j-piasecki)adjustsFontSizeToFit
not working on Android when using the new architecture (747a96b7b3 by @j-piasecki)npx react-native-community/cli config
fails or timeouts proper error is shown and built is aborted, instead of leaving and empty autolinking.json (3782511350 by @mfazekas)rrc_textinput
on Android a shared library (ea8ad6457c by @j-piasecki)convertToCase
(cef17ba14f by @cortinico)JvmStatic
annotations for all methods from AndroidUnicodeUtils.kt
(54dadd7bda by @WoLewicki)textAlign
not being taken into account when positioning views inlined in text (1f08799560 by @j-piasecki)batchRenderingUpdatesInEventLoop
is enabled. (849da2146c by @javache)ReactModalHostView
(15ff82f811 by @cortinico)getChildAtWithSubviewClippingEnabled
(d6a44e632a by @javache)ReactActivity.getReactDelegate().reload()
. (539922339b by @Kudo)JavaTimerManager$IdleCallbackRunnable.cancel
(e686b4330d by @cortinico)contextMenuHidden
(493dbb2190 by @jakex7)RCTRootViewFactory
from Swift (5aea518d88 by @okwasniewski)adjustFontSizeToFit
is set (ed7766cee9 by @j-piasecki)[super viewDidLoad]
in RCTRedBox.mm
. (d93788301c by @hakonk)InputAccessoryView
width on device orientation change (8597727c28 by @mauriciomeirelles)HermesExecutorFactory.h
build error when importing its private header (2d46dbe6ce by @Kudo)RCTImageLoader
and RCTNetworkTask
that were accessed concurrently, which in some cases lead to data races. (ffc16fc18b by @hakonk)bundleURL
so that it can connect to metro on Reload when the url changes. (8b8b85bb1f by @cipolleschi)progress
in onProgress
native event arguments (78ab5f4b83 by @netmaxt3r)FAQs
A framework for building native apps using React
The npm package react-native receives a total of 2,501,986 weekly downloads. As such, react-native popularity was classified as popular.
We found that react-native demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 7 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Product
Ensure open-source compliance with Socket’s License Enforcement Beta. Set up your License Policy and secure your software!
Product
We're launching a new set of license analysis and compliance features for analyzing, managing, and complying with licenses across a range of supported languages and ecosystems.
Product
We're excited to introduce Socket Optimize, a powerful CLI command to secure open source dependencies with tested, optimized package overrides.