Skip to content

Commit ea8571b

Browse files
hramosfacebook-github-bot
authored andcommitted
Update README (#23779)
Summary: Clean up and make the README look a bit nicer. Inspired by https://github.com/gatsbyjs/gatsby/blob/master/README.md. This PR brings back an introduction to React Native that focuses on our strengths. I'm happy to punt updates to the marketing copy for later, if we want to focus on updating the README layout first. ![readme](https://user-images.githubusercontent.com/165856/53846592-59f3b700-3f62-11e9-95cf-4391c74460f4.png) [General][Changed] - Nicer README. Pull Request resolved: #23779 Differential Revision: D14341562 Pulled By: hramos fbshipit-source-id: 87dba4fe4e3598f638fdc499347a2c9aedde8f8d
1 parent fe80a0c commit ea8571b

File tree

1 file changed

+123
-34
lines changed

1 file changed

+123
-34
lines changed

README.md

Lines changed: 123 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,58 +1,147 @@
1-
# [React Native](https://facebook.github.io/react-native/) · [![Circle CI Status](https://circleci.com/gh/facebook/react-native.svg?style=shield)](https://circleci.com/gh/facebook/react-native) [![Build status](https://ci.appveyor.com/api/projects/status/g8d58ipi3auqdtrk/branch/master?svg=true)](https://ci.appveyor.com/project/facebook/react-native/branch/master) [![npm version](https://badge.fury.io/js/react-native.svg)](https://badge.fury.io/js/react-native) [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](CONTRIBUTING.md#pull-requests)
2-
3-
Learn once, write anywhere: Build mobile apps with React.
4-
5-
See the official [React Native website](https://facebook.github.io/react-native/) for an introduction to React Native.
1+
<h1 align="center">
2+
<a href="https://facebook.github.io/react-native/">
3+
React Native
4+
</a>
5+
</h1>
6+
7+
<p align="center">
8+
<strong>Learn once, write anywhere:</strong><br>
9+
Build mobile apps with React.
10+
</p>
11+
12+
<p align="center">
13+
<a href="https://github.com/facebook/react-native/blob/master/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://circleci.com/gh/facebook/react-native">
17+
<img src="https://circleci.com/gh/facebook/react-native.svg?style=shield" alt="Current CircleCI build status." />
18+
</a>
19+
<a href="https://ci.appveyor.com/project/facebook/react-native/branch/master">
20+
<img src="https://ci.appveyor.com/api/projects/status/g8d58ipi3auqdtrk/branch/master?svg=true" alt="Current Appveyor build status." />
21+
</a>
22+
<a href="https://www.npmjs.org/package/react-native">
23+
<img src="https://badge.fury.io/js/react-native.svg" alt="Current npm package version." />
24+
</a>
25+
<a href="https://facebook.github.io/react-native/docs/contributing">
26+
<img src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg" alt="PRs welcome!" />
27+
</a>
28+
<a href="https://twitter.com/intent/follow?screen_name=reactnative">
29+
<img src="https://img.shields.io/twitter/follow/reactnative.svg?label=Follow%20@reactnative" alt="Follow @reactnative" />
30+
</a>
31+
</p>
32+
33+
<h3 align="center">
34+
<a href="https://facebook.github.io/react-native/docs/getting-started">Getting Started</a>
35+
<span> · </span>
36+
<a href="https://facebook.github.io/react-native/docs/tutorial">Learn the Basics</a>
37+
<span> · </span>
38+
<a href="https://facebook.github.io/react-native/showcase.html">Showcase</a>
39+
<span> · </span>
40+
<a href="https://facebook.github.io/react-native/docs/contributing">Contribute</a>
41+
<span> · </span>
42+
<a href="https://facebook.github.io/react-native/en/help">Community</a>
43+
<span> · </span>
44+
<a href="https://github.com/facebook/react-native/blob/master/.github/SUPPORT">Support</a>
45+
</h3>
46+
47+
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.
48+
49+
- **Declarative.** React makes it painless to create interactive UIs. Declarative views make your code more predictable and easier to debug.
50+
- **Component-Based.** Build encapsulated components that manage their own state, then compose them to make complex UIs.
51+
- **Developer Velocity.** See local changes in seconds. Changes to JavaScript code can be live reloaded without rebuilding the native app.
52+
- **Portability.** Reuse code across iOS, Android, and [other platforms][p].
53+
54+
[r]: https://reactjs.org/
55+
[p]: https://facebook.github.io/react-native/docs/out-of-tree-platforms
56+
57+
## Contents
658

759
- [Requirements](#requirements)
8-
- [Getting Started](#building-your-first-react-native-app)
9-
- [Documentation](#full-documentation)
10-
- [Upgrading](https://facebook.github.io/react-native/docs/upgrading)
11-
- [Contributing](#join-the-react-native-community)
12-
- [Code of Conduct](./CODE_OF_CONDUCT.md)
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)
1365
- [License](#license)
1466

15-
---
1667

17-
## Requirements
68+
## 📋 Requirements
1869

19-
Supported target operating systems are >= Android 4.1 (API 16) and >= iOS 9.0. You may use Windows, macOS, or Linux as your development operating system, though building and running iOS apps is limited to macOS by default (tools like [Expo](https://expo.io) can be used to get around this).
70+
React Native apps may target iOS 9.0 and Android 4.1 (API 16) 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.io) can be used to work around this.
2071

21-
## Building your first React Native app
72+
## 🎉 Building your first React Native app
2273

2374
Follow the [Getting Started guide](https://facebook.github.io/react-native/docs/getting-started.html). The recommended way to install React Native depends on your project. Here you can find short guides for the most common scenarios:
2475

25-
- [Trying out React Native](https://snack.expo.io/BJ-uC-nrb)
26-
- [Creating a New Application](https://facebook.github.io/react-native/docs/getting-started.html)
27-
- [Adding React Native to an Existing Application](https://facebook.github.io/react-native/docs/integration-with-existing-apps.html)
76+
- [Trying out React Native][hello-world]
77+
- [Creating a New Application][new-app]
78+
- [Adding React Native to an Existing Application][existing]
79+
80+
[hello-world]: https://snack.expo.io/@hramos/hello,-world!
81+
[new-app]: https://facebook.github.io/react-native/docs/getting-started.html
82+
[existing]: https://facebook.github.io/react-native/docs/integration-with-existing-apps.html
83+
84+
## 📖 Documentation
85+
86+
The full documentation for React Native can be found on our [website][docs].
87+
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].
89+
90+
The source for the React Native documentation and website is hosted on a separate repo, [**@facebook/react-native-website**][repo-website].
91+
92+
[docs]: https://facebook.github.io/react-native/docs/getting-started.html
93+
[r-docs]: https://reactjs.org/docs/getting-started.html
94+
[repo-website]: (https://github.com/facebook/react-native-website)
95+
96+
## 🚀 Upgrading
97+
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.
99+
100+
React Native releases are discussed in the React Native Community, [**@react-native-community/react-native-releases**][repo-releases].
101+
102+
[u]: https://facebook.github.io/react-native/docs/upgrading
103+
[repo-releases]: https://github.com/react-native-community/react-native-releases
104+
105+
## 👏 How to Contribute
106+
107+
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 bugfixes and improvements. Read below to learn how you can take part in improving React Native.
108+
109+
### [Code of Conduct][code]
110+
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.
113+
114+
[code]: https://code.fb.com/codeofconduct/
115+
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.
28119

29-
## How React Native works
120+
[contribute]: https://facebook.github.io/react-native/docs/contributing
30121

31-
React Native lets you build mobile apps using JavaScript. It uses the same design as [React](https://facebook.github.io/react), letting you compose a rich mobile UI from declarative components.
122+
### [Open Source Roadmap][roadmap]
32123

33-
With React Native, you don't build a "mobile web app", an "HTML5 app", or a "hybrid app". You build a real mobile app that's indistinguishable from an app built using Objective-C, Java, Kotlin, or Swift. React Native uses the same fundamental UI building blocks as regular iOS and Android apps. You just put those building blocks together using JavaScript and React.
124+
You can learn more about our vision for React Native in the [**Roadmap**][roadmap].
34125

35-
React Native lets you build your app faster. Instead of recompiling, you can reload your app instantly. With hot reloading, you can even run new code while retaining your application state.
126+
[roadmap]: https://github.com/facebook/react-native/wiki/Roadmap
36127

37-
React Native combines smoothly with components written in Objective-C, Java, Kotlin, or Swift. It's simple to drop down to native code if you need to optimize a few aspects of your application. It's also easy to build part of your app in React Native, and part of your app using native code directly - that's how the Facebook app works.
128+
### Good First Issues
38129

39-
The focus of React Native is on developer efficiency across all the platforms you care about - learn once, write anywhere. Facebook uses React Native in multiple production apps and will continue investing in React Native. You can learn more about our open source roadmap in this blog post: [Open Source Roadmap](https://facebook.github.io/react-native/blog/2018/11/01/oss-roadmap).
130+
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.
40131

41-
## Full documentation
132+
[gfi]: https://github.com/facebook/react-native/labels/good%20first%20issue
42133

43-
The full documentation for React Native can be found on our [website](https://facebook.github.io/react-native/docs/getting-started.html). The source for the React Native documentation and website is hosted on a separate repo, <https://github.com/facebook/react-native-website>. Releases are discussed in the React Native Community, <https://github.com/react-native-community/react-native-releases>, and larger discussions and proposals are in <https://github.com/react-native-community/discussions-and-proposals>.
134+
### Discussions
44135

45-
The React Native documentation only discusses the components, APIs, and topics specific to React Native (React on iOS and Android). For further documentation on the React API that is shared between React Native and React DOM, refer to the [React documentation](https://facebook.github.io/react/).
136+
Larger discussions and proposals are discussed in [**@react-native-community/discussions-and-proposals**][repo-meta].
46137

47-
## Join the React Native community
48-
* Website: https://facebook.github.io/react-native
49-
* Twitter: https://twitter.com/reactnative
50-
* Help: https://facebook.github.io/react-native/en/help
138+
[repo-meta]: https://github.com/react-native-community/discussions-and-proposals
51139

52-
See the [CONTRIBUTING](./CONTRIBUTING.md) file for how to help out.
140+
## 📄 License
53141

54-
## License
142+
React Native is MIT licensed, as found in the [LICENSE][l] file.
55143

56-
React Native is MIT licensed, as found in the LICENSE file.
144+
React Native documentation is Creative Commons licensed, as found in the [LICENSE-docs][ld] file.
57145

58-
React Native documentation is Creative Commons licensed, as found in the LICENSE-docs file.
146+
[l]: https://github.com/facebook/react-native/blob/master/LICENSE
147+
[ld]: https://github.com/facebook/react-native/blob/master/LICENSE-docs

0 commit comments

Comments
 (0)