React-Native Basic Component

Text

import React, { Component } from 'react'
import { AppRegistry, Text } from 'react-native'
 const App = () => <Text>Hello World</Text>

 AppRegistry.registerComponent("Project", () => App)
 
### Image
import React, { Component } from 'react'
import { AppRegistry, Image } from 'react-native'

const App = () => <Image source = {require('./img/sample.png')} />

AppRegistry.registerComponent("Project", () => App)
 
### View
import React, { Component } from 'react'
import { AppRegistry, Text, View } from 'react-native'

const App = () => (
  <View style={{alignItems: 'center'}} >
    <Text>Hello World</Text>
  </View>
)

AppRegistry.registerComponent("Project", () => App)
`</pre>

### TextInput

<pre>`import React from 'react'
import { AppRegistry, TextInput, View } from 'react-native'

const App = () =&gt; (
  &lt;View&gt;
    &lt;TextInput placeholder = "Hello" /&gt;
  &lt;/View&gt;
)

AppRegistry.registerComponent('Project', () =&gt; App)
`</pre>

### ListView

<pre>`import React, { Component } from 'react'
import { AppRegistry, Text, View, ListView } from 'react-native'

class SimpleList extends Component {
  constructor(){
    super(props)
    var ds = new ListView.DataSource({
      rowHasChanged: (r1,r2) =&gt; r1!==r2
    })

    this.state = {
      dataSource: ds.cloneWithRows(['john', 'joel','james','jimmy','jackson'])
    }

  }

  render(){
    return (
      &lt;View&gt;
        &lt;ListView dataSource={this.state.dataSource} renderRow={(rowData) =&gt; &lt;Text&gt;{rowData}&lt;/Text&gt;}
      &lt;/View&gt;
    )
  }
}

AppRegistry.registerComponent("Project", () =&gt; SimpleList)