React Native - App




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

React Native - 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>
      );
   }
}

React Native - App



Frequently Asked Questions

+
Ans: React Native - Environment Setup view more..
+
Ans: React Native - Overview view more..
+
Ans: React Native Tutorial view more..
+
Ans: React Native - App view more..
+
Ans: React Native - State view more..
+
Ans: React Native - Props view more..
+
Ans: React Native - Styling view more..
+
Ans: React Native - Flexbox view more..
+
Ans: React Native - ListView view more..
+
Ans: React Native - Text Input view more..
+
Ans: React Native - ScrollView view more..
+
Ans: React Native - Images view more..
+
Ans: React Native - HTTP view more..
+
Ans: React Native - Buttons view more..
+
Ans: React Native - Animations view more..
+
Ans: React Native - Debugging view more..
+
Ans: React Native - Router view more..
+
Ans: React Native - Running IOS view more..




Rating - NAN/5
539 views

Advertisements