repository·main·Indexed 24 days ago
https://github.com/react/react-native-websiteConfiguration and source documentation for the official React Native website (reactnative.dev). Built with Docusaurus, it includes tools for managing versioned documentation, blog posts, and custom Remark plugins such as remark-snackplayer for embedding interactive Expo Snacks and @react-native-website/lint-examples for linting Snack player examples.
Hermes is an open-source JavaScript engine optimized for React Native. It is designed to improve app start-up time, decrease memory usage, and reduce app size compared to JavaScriptCore.
By default, React Native uses a bundled version of Hermes that is specifically built to be compatible with your version of React Native. No additional configuration is required to enable it.
React Native provides a suite of APIs designed to make mobile applications accessible to assistive technologies, specifically targeting the bundled screen readers: VoiceOver on iOS and TalkBack on Android.
Because Android and iOS have different underlying approaches to accessibility, React Native implementations may vary depending on the platform. Developers should use these APIs to ensure their apps accommodate all users by providing semantic information to these screen readers.
React Native provides wrappers for common Android classes to handle platform-specific functionality:
BackHandler: Detect hardware button presses for back navigation.DrawerLayoutAndroid: Renders a DrawerLayout on Android.PermissionsAndroid: Provides access to the Android M permissions model.ToastAndroid: Creates an Android Toast alert.Notable updates in this release include:
hotkeysEnabled option in the iOS debug menu..xcode.env configuration file for more deterministic sourcing of the node executable.React Native 0.67.0 introduced several key changes to the core and build environment:
DatePickerAndroid.7.2 and Kotlin version to 1.5.31.0.9.0 (unchanged from 0.66).For a detailed list of all changes, refer to the full changelog.
@react-native-website/lint-examples script is used to lint Snack player examples. It simulates a linting environment as if the examples were part of a newly built React Native project. When linting is performed, any changes made by the linter are automatically patched back into the original source document.The codeblockLanguageAsTitleRemarkPlugin is a custom remark plugin designed for Markdown processing. It automatically populates the title metadata of a code block using the language identifier specified in the code block's fence.
Key behaviors:
js, python), the plugin sets the title metadata to that language name.meta) but is missing a title, the plugin appends the title while keeping the existing metadata intact.meta field already contains a title property, the plugin skips that block to prevent overwriting user-defined titles.React Native support for desktop is primarily driven by react-native-windows and react-native-macos (maintained by Microsoft).
Key developments for desktop include:
react-native-screensreact-native-gesture-handlerreact-native-reanimatedThe Text component is used to display text in React Native. It supports nesting, styling, and touch handling. Unlike web development where text can exist directly inside a View, in React Native, all text nodes must be wrapped in a <Text> component. Placing a raw text node directly under a <View> will raise an exception.
To maintain consistent typography across an app, it is recommended to create a custom wrapper component (e.g., MyAppText) that applies default styles, rather than relying on global CSS-like inheritance which is not supported.
<View>
<Text>
Some text
</Text>
</View>The website is a static site generated using Docusaurus. The content and configuration are organized as follows:
docs/: Contains the source markdown files for the versioned documentation (Guides, Components, and APIs).website/architecture/: Contains unversioned/static documentation for the Architecture tab.website/blog/: Contains blog posts.website/contributing/: Contains documentation for the Contribution tab.website/core/: Contains custom JavaScript and React components used by the site.website/src/css/: Contains custom styles.website/src/pages/: Contains React components for non-documentation pages (e.g., the homepage).website/src/theme/: Contains swizzled Docusaurus theme components.website/static/: Contains static assets (images, blog assets, etc.).website/versioned_docs/: Auto-generated files for older versions of the documentation.website/versioned_sidebars/: Auto-generated sidebar configurations for older versions.website/docusaurus.config.ts: The main Docusaurus configuration file.website/sidebars.ts, website/sidebarsArchitecture.ts, website/sidebarsContributing.ts: Files used to define the order of documents in the sidebars.The documentation regarding the React Native New Architecture is currently experimental. Details are subject to change as the architecture iterates.
Users should be aware that the current documentation involves several manual steps that may not be representative of the final developer experience. The React Native team is actively working on tools, templates, and libraries to automate and simplify the setup process once the New Architecture reaches stability.