Home.js

import { Text, View, TouchableOpacity, StyleSheet} from 'react-native';
import { AntDesign } from '@expo/vector-icons';

export default function HomeScreen(props) {
  return (
    <View style={styles.homscreen}>
      <Text style={{ fontSize: 24, fontWeight: 'bold'}}>Longboard Hangout</Text>
      <TouchableOpacity
        onPress={() => props.navigation.navigate('Map')}
        style={{ marginTop: 20 }}>
        <Text style={{ fontSize: 18, color: 'blue' }}>Find Skate Spots Near You</Text>
      </TouchableOpacity>
      <TouchableOpacity
        onPress={() => props.navigation.openDrawer()}
        style={{ position: 'absolute', right: 20, bottom: 20 }}>
        <AntDesign name="folderopen" size={50} color="blue" />
      </TouchableOpacity>
    </View>
  );
}

const styles = StyleSheet.create({
  homscreen: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: 'orange'
  }
});