2
2
3
3
[ ![ npm version] [ package-badge ]] [ package-url ] [ ![ Build Status] [ ci-badge ]] [ ci-url ] [ ![ PRs Welcome] ( https://img.shields.io/badge/PRs-welcome-brightgreen.svg )] ( https://reactjs.org/docs/how-to-contribute.html#your-first-pull-request )
4
4
5
- ** Compatibility: React Native 0.55 ** .
5
+ ** Compatibility: React Native >= 0.60 ** .
6
6
7
7
"React Native for Web" makes it possible to run [ React
8
- Native] [ react-native-url ] components and APIs on the web using React DOM. Check
9
- out the live demo of the [ React Native examples] [ examples-url ] running on the
10
- web.
8
+ Native] [ react-native-url ] components and APIs on the web using React DOM.
11
9
12
10
* ** High-quality web interfaces** : makes it easy to
13
11
create [ fast] ( https://github.com/necolas/react-native-web/blob/master/packages/benchmarks/README.md ) ,
@@ -27,68 +25,47 @@ Who is using React Native in production web apps?
27
25
[ Major League Soccer] ( https://matchcenter.mlssoccer.com ) ,
28
26
[ Flipkart] ( https://twitter.com/naqvitalha/status/969577892991549440 ) ,
29
27
[ Uber] ( https://www.youtube.com/watch?v=RV9rxrNIxnY ) ,
30
- [ The Times] ( https://github.com/newsuk/times-components ) , [ DataCamp] ( https://www.datacamp.com/community/tech/porting-practice-to-web-part1 ) .
28
+ [ The Times] ( https://github.com/newsuk/times-components ) ,
29
+ [ DataCamp] ( https://www.datacamp.com/community/tech/porting-practice-to-web-part1 ) .
31
30
32
31
Browser support: Chrome, Firefox, Edge, Safari 7+, IE 10+.
33
32
34
33
## Quick start
35
34
36
35
The easiest way to get started is to edit this
37
- [ CodeSandbox] ( https://codesandbox.io/s/q4qymyp2l6 ) template (or
38
- [ Glitch] ( https://glitch.com/edit/#!/react-native ) ). You don’t need to install
39
- anything to try it out.
40
-
41
- For installation and configuration details please read the [ getting
42
- started] ( https://github.com/necolas/react-native-web/blob/master/docs/guides/getting-started.md )
43
- guide.
36
+ [ CodeSandbox] ( https://codesandbox.io/s/q4qymyp2l6 ) template. You don’t need to
37
+ install anything to try it out.
44
38
45
39
## Documentation
46
40
47
- Please refer to the [ React Native documentation] [ react-native-url ] for the
48
- overall API, design details, and information about the [ Gesture Responder
49
- system] ( https://facebook.github.io/react-native/docs/gesture-responder-system.html )
50
- and [ animations] ( https://facebook.github.io/react-native/docs/animations.html ) .
51
-
52
- Some components and APIs are extended with additional features for the web. And
53
- in a few cases, features present for Android or iOS are missing on the web.
54
- These differences are documented [ on the website] [ website-url ] .
55
-
56
- ### Guides
57
-
58
- These guides provide a detailed look at using React Native to create accessible
59
- web experiences. Certain web-specific patterns are documented in the "web
60
- recipes" guide.
41
+ The [ documentation app] ( https://necolas.github.com/react-native-web/docs ) covers
42
+ installation, configuration, APIs, and guides.
61
43
62
- * [ Getting started] ( https://github.com/necolas/react-native-web/blob/master/docs/guides/getting-started.md )
63
- * [ Client-side rendering] ( https://github.com/necolas/react-native-web/blob/master/docs/guides/client-side-rendering.md )
64
- * [ Server-side rendering] ( https://github.com/necolas/react-native-web/blob/master/docs/guides/server-side-rendering.md )
65
- * [ Style] ( https://github.com/necolas/react-native-web/blob/master/docs/guides/style.md )
66
- * [ Accessibility] ( https://github.com/necolas/react-native-web/blob/master/docs/guides/accessibility.md )
67
- * [ Internationalization] ( https://github.com/necolas/react-native-web/blob/master/docs/guides/internationalization.md )
68
- * [ Direct manipulation] ( https://github.com/necolas/react-native-web/blob/master/docs/guides/direct-manipulation.md )
69
- * [ Web recipes] ( https://github.com/necolas/react-native-web/blob/master/docs/guides/web-recipes.md )
70
- * [ Multi-platform apps] ( https://github.com/necolas/react-native-web/blob/master/docs/guides/multi-platform-apps.md )
71
- * [ Experimental / unstable use] ( https://github.com/necolas/react-native-web/blob/master/docs/guides/advanced.md )
44
+ The [ React Native documentation] [ react-native-url ] contains more information
45
+ about the [ Gesture Responder
46
+ system] ( https://facebook.github.io/react-native/docs/gesture-responder-system.html ) ,
47
+ [ animations] ( https://facebook.github.io/react-native/docs/animations.html ) , and
48
+ other design details.
72
49
73
50
## Integrations
74
51
75
52
Examples of using React Native for Web with other web tools:
76
53
77
54
* [ Docz] ( https://github.com/pedronauck/docz-plugin-react-native )
78
55
* [ Gatsby] ( https://github.com/slorber/gatsby-plugin-react-native-web )
79
- * [ Next.js] ( https://github.com/zeit/next.js/tree/master/examples/with-react-native-web ) (and [ example recipes] ( https://gist.github.com/necolas/f9034091723f1b279be86c7429eb0c96 ) )
56
+ * [ Next.js] ( https://github.com/zeit/next.js/tree/master/examples/with-react-native-web )
57
+ (and [ example recipes] ( https://gist.github.com/necolas/f9034091723f1b279be86c7429eb0c96 ) )
80
58
* [ Phenomic] ( https://github.com/phenomic/phenomic/tree/master/examples/react-native-web-app )
81
59
* [ Razzle] ( https://github.com/jaredpalmer/razzle/tree/master/examples/with-react-native-web )
82
60
* [ Storybook] ( https://github.com/necolas/react-native-web/tree/master/packages/website/storybook/.storybook )
83
61
* [ Styleguidist] ( https://github.com/styleguidist/react-styleguidist/tree/master/examples/react-native )
84
62
85
63
## Examples
86
64
87
- Check out all the [ React Native examples] [ examples-url ] ([ source
88
- code] ( https://github.com/necolas/react-native-web/blob/master/packages/examples ) ).
89
- There are more examples [ on the website] [ website-url ] ([ source
90
- code] ( https://github.com/necolas/react-native-web/blob/master/packages/website ) ).
91
- And here is a simple example to get you started:
65
+ And here is a simple example to get you started. The documentation include
66
+ interactive examples and the [ source
67
+ code] ( https://github.com/necolas/react-native-web/blob/master/packages/docs ) is
68
+ also available.
92
69
93
70
``` js
94
71
import React from ' react' ;
@@ -121,7 +98,7 @@ Native. This allows the app to be rendered to web and native platforms.
121
98
122
99
## Compatibility with React Native
123
100
124
- React Native v0.55
101
+ React Native v0.60
125
102
126
103
### Components
127
104
@@ -141,7 +118,6 @@ React Native v0.55
141
118
| ScrollView | ✓ | Missing momentum scroll events ([ #1021 ] ( https://github.com/necolas/react-native-web/issues/1021 ) ). |
142
119
| SectionList | ✓ | |
143
120
| StatusBar | (✓) | Mock. No equivalent web APIs. |
144
- | SwipeableFlatList | ✓ | |
145
121
| Switch | ✓ | |
146
122
| Text | ✓ | Missing ` onLongPress ` ([ #1011 ] ( https://github.com/necolas/react-native-web/issues/1011 ) ) support. |
147
123
| TextInput | ✓ | Missing rich text features ([ #1023 ] ( https://github.com/necolas/react-native-web/issues/1023 ) ), and auto-expanding behaviour ([ #795 ] ( https://github.com/necolas/react-native-web/issues/795 ) ). |
@@ -228,8 +204,6 @@ MIT license.
228
204
[ package-url ] : https://yarnpkg.com/en/package/react-native-web
229
205
[ ci-badge ] : https://travis-ci.org/necolas/react-native-web.svg?branch=master
230
206
[ ci-url ] : https://travis-ci.org/necolas/react-native-web
231
- [ examples-url ] : https://necolas.github.io/react-native-web/examples/
232
- [ website-url ] : https://necolas.github.io/react-native-web/storybook/
233
207
[ react-native-url ] : https://facebook.github.io/react-native/
234
208
[ contributing-url ] : https://github.com/necolas/react-native-web/blob/master/.github/CONTRIBUTING.md
235
209
[ good-first-issue-url ] : https://github.com/necolas/react-native-web/labels/good%20first%20issue
0 commit comments