Skip to content

Commit c3bda80

Browse files
huntiefacebook-github-bot
authored andcommitted
Refresh README (#57946)
Summary: Refresh the root `README.md`. This is generally simplified and aligned closer with the React repo's headings/structure. **Changes** - **Rewrite intro** and add banner logo. - Drop Contents, Requirements, and Upgrading sections. - Extend set of website docs links. - **Add inline starting guidance for Expo**. - Drop emojis. - Inline markdown links. - Fix badge styling (underline bleed). - Drop Bluesky badge. - Add download count badge. - Facebook → Meta. Changelog: [Internal] Differential Revision: D115879599
1 parent 0927347 commit c3bda80

1 file changed

Lines changed: 58 additions & 91 deletions

File tree

README.md

Lines changed: 58 additions & 91 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,25 @@
1-
<h1 align="center">
2-
<a href="https://reactnative.dev/">
3-
React Native
4-
</a>
5-
</h1>
1+
<p align="center">
2+
<picture>
3+
<source media="(prefers-color-scheme: dark)" srcset="https://reactnative.dev/react-native-dark.svg">
4+
<source media="(prefers-color-scheme: light)" srcset="https://reactnative.dev/react-native-light.svg">
5+
<img alt="React Native logo" src="https://reactnative.dev/react-native-light.svg" height="80">
6+
</picture>
7+
</p>
68

79
<p align="center">
810
<strong>Learn once, write anywhere:</strong><br>
9-
Build mobile apps with React.
11+
Create native apps for Android, iOS, and more using React
1012
</p>
1113

1214
<p align="center">
13-
<a href="https://github.com/facebook/react-native/blob/HEAD/LICENSE">
14-
<img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="React Native is released under the MIT license." />
15-
</a>
16-
<a href="https://www.npmjs.org/package/react-native">
17-
<img src="https://img.shields.io/npm/v/react-native?color=brightgreen&label=npm%20package" alt="Current npm package version." />
18-
</a>
19-
<a href="https://reactnative.dev/docs/contributing">
20-
<img src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg" alt="PRs are welcome!" />
21-
</a>
22-
<a href="https://twitter.com/intent/follow?screen_name=reactnative">
23-
<img src="https://img.shields.io/twitter/follow/reactnative.svg?label=Follow%20@reactnative" alt="Follow @reactnative on X" />
24-
</a>
25-
<a href="https://bsky.app/profile/reactnative.dev">
26-
<img src="https://img.shields.io/badge/Bluesky-0285FF?logo=bluesky&logoColor=fff" alt="Follow @reactnative.dev on Bluesky" />
27-
</a>
15+
<a href="https://github.com/react/react-native/blob/HEAD/LICENSE"><img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="React Native is released under the MIT license" /></a>
16+
<a href="https://www.npmjs.com/package/react-native"><img src="https://img.shields.io/npm/v/react-native.svg?color=blue" alt="Current npm package version" /></a>
17+
<a href="https://www.npmjs.com/package/react-native"><img src="https://img.shields.io/npm/dm/react-native.svg" alt="Monthly npm downloads" /></a>
18+
<a href="https://twitter.com/intent/follow?screen_name=reactnative"><img src="https://img.shields.io/badge/Follow_@reactnative-black?logo=x&logoColor=white" alt="Follow @reactnative on X" /></a>
2819
</p>
2920

30-
<h3 align="center">
31-
<a href="https://reactnative.dev/docs/getting-started">Getting Started</a>
21+
<h4 align="center">
22+
<a href="https://reactnative.dev/docs/environment-setup">Getting Started</a>
3223
<span> · </span>
3324
<a href="https://reactnative.dev/docs/tutorial">Learn the Basics</a>
3425
<span> · </span>
@@ -38,101 +29,77 @@
3829
<span> · </span>
3930
<a href="https://reactnative.dev/help">Community</a>
4031
<span> · </span>
41-
<a href="https://github.com/facebook/react-native/blob/HEAD/.github/SUPPORT.md">Support</a>
42-
</h3>
43-
44-
React Native brings [**React**'s][r] declarative UI framework to iOS and Android. With React Native, you use native UI controls and have full access to the native platform.
45-
46-
- **Declarative.** React makes it painless to create interactive UIs. Declarative views make your code more predictable and easier to debug.
47-
- **Component-Based.** Build encapsulated components that manage their state, then compose them to make complex UIs.
48-
- **Developer Velocity.** See local changes in seconds. Changes to JavaScript code can be live reloaded without rebuilding the native app.
49-
- **Portability.** Reuse code across iOS, Android, and [other platforms][p].
50-
51-
React Native is developed and supported by many companies and individual core contributors. Find out more in our [ecosystem overview][e].
52-
53-
[r]: https://react.dev/
54-
[p]: https://reactnative.dev/docs/out-of-tree-platforms
55-
[e]: https://github.com/facebook/react-native/blob/HEAD/ECOSYSTEM.md
56-
57-
## Contents
32+
<a href="https://github.com/react/react-native/blob/HEAD/.github/SUPPORT.md">Support</a>
33+
</h4>
5834

59-
- [Requirements](#-requirements)
60-
- [Building your first React Native app](#-building-your-first-react-native-app)
61-
- [Documentation](#-documentation)
62-
- [Upgrading](#-upgrading)
63-
- [How to Contribute](#-how-to-contribute)
64-
- [Code of Conduct](#code-of-conduct)
65-
- [License](#-license)
35+
# React Native
6636

37+
React Native lets you build native apps using [React](https://react.dev/). Written
38+
in JavaScript, rendered with native code.
6739

68-
## 📋 Requirements
40+
- **Native UI.** React Native primitives render to native platform UI, meaning your app
41+
uses the same native platform APIs other apps do. Gestures, text scaling, and
42+
accessibility behave the way users expect on each OS.
43+
- **React, everywhere.** Declarative UI, components, hooks, and Suspense, reused
44+
across Android, iOS, and [other platforms](https://reactnative.dev/docs/out-of-tree-platforms).
45+
- **Developer Velocity.** See local changes in seconds. Changes to JavaScript code are applied with Fast Refresh, without rebuilding the native app.
46+
- **Extend it yourself.** Native Modules let you call platform code directly from JavaScript, synchronously and type-safe — or reach for [thousands of existing libraries](https://reactnative.directory/).
6947

70-
React Native apps may target iOS 15.1 and Android 7.0 (API 24) 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](https://expo.dev) can be used to work around this.
48+
React Native is developed and supported by many companies and individual core contributors. Find out more in our [ecosystem overview](https://github.com/react/react-native/blob/HEAD/ECOSYSTEM.md).
7149

72-
## 🎉 Building your first React Native app
50+
## Building your first React Native app
7351

74-
Follow the [Getting Started guide](https://reactnative.dev/docs/getting-started). The recommended way to install React Native depends on your project. Here you can find short guides for the most common scenarios:
52+
Follow the [Getting Started guide](https://reactnative.dev/docs/environment-setup) for a new app, or [Integration with Existing Apps](https://reactnative.dev/docs/integration-with-existing-apps) to adopt React Native incrementally.
7553

76-
- [Trying out React Native][hello-world]
77-
- [Creating a New Application][new-app]
78-
- [Adding React Native to an Existing Application][existing]
54+
### Using a Framework
7955

80-
[hello-world]: https://snack.expo.dev/@samples/hello-world
81-
[new-app]: https://reactnative.dev/docs/getting-started
82-
[existing]: https://reactnative.dev/docs/integration-with-existing-apps
56+
We believe that the best way to experience React Native is through a Framework, a toolbox with all the necessary APIs to let you build production ready apps. [Expo](https://docs.expo.dev/get-started/set-up-your-environment/) is a production-grade React Native Framework, with file-based routing, a standard library of native modules, and much more.
8357

84-
## 📖 Documentation
58+
To create a new Expo project, run the following in your terminal:
8559

86-
The full documentation for React Native can be found on our [website][docs].
60+
npx create-expo-app@latest
8761

88-
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][r-docs].
62+
Then follow the rest of [Expo's getting started guide](https://docs.expo.dev/get-started/set-up-your-environment/) to start building.
8963

90-
The source for the React Native documentation and website is hosted on a separate repository, [**@facebook/react-native-website**][repo-website].
64+
### Without a Framework
9165

92-
[docs]: https://reactnative.dev/docs/getting-started
93-
[r-docs]: https://react.dev/learn
94-
[repo-website]: https://github.com/facebook/react-native-website
66+
You can also use React Native without a Framework, however we've found that most developers benefit from one — navigation, native dependencies, and platform tooling are problems the ecosystem has already solved. If a Framework doesn't suit your app, follow [Getting Started Without a Framework](https://reactnative.dev/docs/getting-started-without-a-framework).
9567

96-
## 🚀 Upgrading
68+
## Documentation
9769

98-
Upgrading to new versions of React Native may give you access to more APIs, views, developer tools, and other goodies. See the [Upgrading Guide][u] for instructions.
70+
The full documentation for React Native can be found on our [website](https://reactnative.dev/docs/getting-started).
9971

100-
React Native releases are discussed [in this discussion repo](https://github.com/reactwg/react-native-releases/discussions).
72+
- [Introduction](https://reactnative.dev/docs/getting-started)
73+
- [Getting Started](https://reactnative.dev/docs/environment-setup)
74+
- [Learn the Basics](https://reactnative.dev/docs/tutorial)
75+
- [Components and APIs](https://reactnative.dev/docs/components-and-apis)
76+
- [UI & Interaction](https://reactnative.dev/docs/style)
77+
- [Native Modules](https://reactnative.dev/docs/native-platform)
78+
- [Debugging](https://reactnative.dev/docs/debugging)
79+
- [Upgrading](https://reactnative.dev/docs/upgrading)
80+
- [Architecture](https://reactnative.dev/architecture/overview)
10181

102-
[u]: https://reactnative.dev/docs/upgrading
103-
[repo-releases]: https://github.com/react-native-community/react-native-releases
82+
The source for the React Native docs and website is hosted on a separate repository, [**react/react-native-website**](https://github.com/react/react-native-website).
10483

105-
## 👏 How to Contribute
84+
## Contributing
10685

10786
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.
10887

109-
### [Code of Conduct][code]
88+
### [Code of Conduct](https://code.fb.com/codeofconduct/)
11089

111-
Facebook has adopted a Code of Conduct that we expect project participants to adhere to.
112-
Please read the [full text][code] so that you can understand what actions will and will not be tolerated.
90+
Meta has adopted a Code of Conduct that we expect project participants to adhere to.
91+
Please read the [full text](https://code.fb.com/codeofconduct/) so that you can understand what actions will and will not be tolerated.
11392

114-
[code]: https://code.fb.com/codeofconduct/
93+
### [Contributing Guide](https://reactnative.dev/docs/contributing)
11594

116-
### [Contributing Guide][contribute]
117-
118-
Read our [**Contributing Guide**][contribute] to learn about our development process, how to propose bugfixes and improvements, and how to build and test your changes to React Native.
119-
120-
[contribute]: https://reactnative.dev/docs/contributing
121-
122-
### Good First Issues
123-
124-
We have a list of [good first issues][gfi] 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.
125-
126-
[gfi]: https://github.com/facebook/react-native/labels/good%20first%20issue
95+
Read our [**Contributing Guide**](https://reactnative.dev/docs/contributing) to learn about our development process, how to propose bugfixes and improvements, and how to build and test your changes to React Native.
12796

12897
### Discussions
12998

130-
Larger discussions and proposals are discussed in [**@react-native-community/discussions-and-proposals**][repo-meta].
131-
132-
[repo-meta]: https://github.com/react-native-community/discussions-and-proposals
99+
Larger discussions and proposals are discussed in [**react-native-community/discussions-and-proposals**](https://github.com/react-native-community/discussions-and-proposals).
133100

134-
## 📄 License
101+
React Native releases are discussed in [**reactwg/react-native-releases**](https://github.com/reactwg/react-native-releases/discussions).
135102

136-
React Native is MIT licensed, as found in the [LICENSE][l] file.
103+
## License
137104

138-
[l]: https://github.com/facebook/react-native/blob/main/LICENSE
105+
React Native is MIT licensed, as found in the [LICENSE](https://github.com/react/react-native/blob/main/LICENSE) file.

0 commit comments

Comments
 (0)