home page desing

frontend/App.js

@@ -10,7 +10,7 @@ import {
 import {LogBox } from 'react-native';
 LogBox.ignoreLogs(['Reanimated 2']);
 
-import home from "./src/screen/home";
+import home from "./src/screen/Home";
 import profile from "./src/screen/profile";
 import report from "./src/screen/report";
 

frontend/src/screen/home.js

 import React from "react";
-import { StyleSheet, View, Text, Pressable } from 'react-native';
+import { SafeAreaView, ScrollView, View, Text } from "react-native";
+import { NavigationContainer } from "@react-navigation/native";
+import { createDrawerNavigator, DrawerItem } from "@react-navigation/drawer";
+import FontAwesome5 from 'react-native-vector-icons/FontAwesome5';
+import profile from "./profile";
+import report from "./report";
 
-export default function home({ navigation }){
+const Drawer = createDrawerNavigator();
 
-    const onPressHandler = () => {
-        navigation.navigate('profile');
-    }
+function Home() {
 
     return (
-        <View>
-            <Text>Home</Text>
-        </View>
-    )
 
-}
+        <Drawer.Navigator
\ No newline at end of file
+        initialRouteName="Profile"
+        screenOptions={{
+          hearderTitleAlign: 'right',
+          alignItems: 'center',
+          justifyContent: 'center',
+          headerStyle:{
+            backgroundColor: '#1DCE92'
+          },
+          headerTintColor: '#ffffff'
+        }}>
+  
+          <Drawer.Screen name="Profile"
+            component={profile}
+            options={{
+              title: 'Profile',
+              drawerIcon: ({focused}) => (
+                <FontAwesome5
+                  name="users"
+                  size={focused ? 25:20} 
+                  color={focused ? '#1DCE92' : '#0096FF'} 
+                />
+              )
+            }}
+          />
+  
+          <Drawer.Screen name="Report"
+            component={report}
+            options={{
+              title: 'Report',
+              drawerIcon: ({focused}) => (
+                <FontAwesome5
+                  name="chart-line"
+                  size={focused ? 25:20}
+                  color={focused ? '#1DCE92' : '#0096FF'} 
+                />
+              )
+            }}
+          />
+  
+  
+        </Drawer.Navigator>
+
+    );
+  
+  }
+
+export default Home;
\ No newline at end of file