nativerepo.com

React Native for Web

Build Status npm version

React Native components and APIs for the Web.

Browser support: Chrome, Firefox, Safari >= 7, IE 10, Edge.

Overview

"React Native for Web" is a project to bring React Native's building blocks and touch handling to the Web.

Browse the UI Explorer to see React Native examples running on Web. Or try it out online with React Native for Web: Playground.

Quick start

To install in your app:

npm install --save react@15.6 react-dom@15.6 react-native-web

NOTE: React Native for Web supports React/ReactDOM 15.4, 15.5, or 15.6.

Then read the Getting Started guide.

Documentation

The UI Explorer interactively documents all the APIs and Components.

Guides:

Example code

import React from 'react'
import { AppRegistry, Image, StyleSheet, Text, View } from 'react-native'

// Components
const Card = ({ children }) => <View style={styles.card}>{children}</View>
const Title = ({ children }) => <Text style={styles.title}>{children}</Text>
const Photo = ({ uri }) => <Image source={{ uri }} style={styles.image} />
const App = () => (
  <Card>
    <Title>App Card</Title>
    <Photo uri="/some-photo.jpg" />
  </Card>
)

// Styles
const styles = StyleSheet.create({
  card: {
    flexGrow: 1,
    justifyContent: 'center'
  },
  title: {
    fontSize: '1.25rem',
    fontWeight: 'bold'
  },
  image: {
    height: 40,
    marginVertical: 10,
    width: 40
  }
})

// App registration and rendering
AppRegistry.registerComponent('MyApp', () => App)
AppRegistry.runApplication('MyApp', { rootTag: document.getElementById('react-root') })

License

React Native for Web is BSD licensed.


Comments
Details
Added at: 2017/03/19
Owner: necolas
Category: other
Homepage: https://github.com/necolas/react-native-web#readme
Downloads last month: 28607
Version: 0.0.113
Compatibility
  •  
  •  

Add to your project

npm i --save react-native-web
yarn add react-native-web