React Native - App



If you open the default app you can observe that the app.js file looks like

 import React from 'react'; import { StyleSheet, Text, View } from 'react-native'; export default class App extends React.Component { render() { return ( <View style = {styles.container}> <Text>Open up App.js to start working on your app!</Text> <Text>Changes you make will automatically reload.</Text> <Text>Shake your phone to open the developer menu.</Text> </View> ); } } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: '#fff', alignItems: 'center', justifyContent: 'center', }, }); 

Output

Working on App

Hello world

To display a simple message saying Welcome to Tutorialspoint remove the CSS part and insert the message to be printed wrapped by the <text></text> tags inside <view></view> as shown below.

 import React from 'react'; import { StyleSheet, Text, View } from 'react-native'; export default class App extends React.Component { render() { return ( <View> <Text>Welcome to Tutorialspoint</Text> </View> ); } } 
Hello World
Advertisements