React Native Cookbook - Second Edition

How to do it...

1. Let's start by importing the dependencies for the main App class, as follows:

import React from 'react';import {  Text,  StyleSheet,  SafeAreaView,} from 'react-native';import ContactList from './ContactList';

2. This component will be simple. All we need to render is a toolbar and the ContactList component that we imported in the previous step, as follows:

const App = () => (  <SafeAreaView style={styles.main}>    <Text style={styles.toolbar}>Contacts</Text>    <ContactList style={styles.content} />  </SafeAreaView>);const styles = StyleSheet.create({  main: {    flex: 1,  },  toolbar: {    backgroundColor: '#2c3e50',    color: '#fff',    fontSize: 22,    padding: 20,    textAlign: 'center',  },  content: {    padding: 10,    flex: 1,  },});export default App; ...