diff --git a/App.js b/App.js
new file mode 100644
index 0000000..8382919
--- /dev/null
+++ b/App.js
@@ -0,0 +1,20 @@
+import { StatusBar } from "expo-status-bar";
+import { StyleSheet, Text, View } from "react-native";
+
+export default function App() {
+  return (
+    <View style={styles.container}>
+      <Text>Hello this is the app.js page</Text>
+      <StatusBar style="auto" />
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: "#fff",
+    alignItems: "center",
+    justifyContent: "center",
+  },
+});
diff --git a/index.js b/index.js
index 6e08a0e..828b356 100644
--- a/index.js
+++ b/index.js
@@ -1,6 +1,6 @@
 import { registerRootComponent } from "expo";
 
-import App from "./src/components/Screens/ModuleListScreen.js";
+import App from "./App";
 
 // registerRootComponent calls AppRegistry.registerComponent('main', () => App);
 // It also ensures that whether you load the app in Expo Go or in a native build,
diff --git a/src/components/screens/Add/add.js b/src/components/screens/Add/add.js
index 77709b2..ce7e179 100644
--- a/src/components/screens/Add/add.js
+++ b/src/components/screens/Add/add.js
@@ -1,4 +1,9 @@
 export default function add() {
+  // Initialisation ...............
+  // State ........................
+  // Handlers .....................
+  // View .........................
+
   return (
     <View style={styles.container}>
       <Text>activity 1 complete on week 1 yay!</Text>
@@ -15,4 +20,3 @@ const styles = StyleSheet.create({
     justifyContent: "center",
   },
 });
-
diff --git a/src/components/screens/ModuleListScreen.js b/src/components/screens/ModuleListScreen.js
index 152dc8c..ed2e4c4 100644
--- a/src/components/screens/ModuleListScreen.js
+++ b/src/components/screens/ModuleListScreen.js
@@ -5,7 +5,7 @@ import { createNativeStackNavigator } from "@react-navigation/native-stack";
 
 const Stack = createNativeStackNavigator();
 
-export const App = () => {
+export const ModuleListScreen = () => {
   return (
     <NavigationContainer>
       <Stack.Navigator initialRouteName="ModuleListScreen">
@@ -17,6 +17,15 @@ export const App = () => {
       </Stack.Navigator>
     </NavigationContainer>
   );
-};
+}
 
-export default App;
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: "#fff",
+    alignItems: "center",
+    justifyContent: "center",
+  },
+});
+
+export default ModuleListScreen;