added react-navigation to mobile app

App.js

@@ -1,18 +1,46 @@
-import React from 'react';
+import React, {Component} from 'react';
 import {StyleSheet, Text, View } from 'react-native';
 import {credentials} from './src/config';
+import {createAppContainer, createSwitchNavigator} from "react-navigation";
+import {createStackNavigator} from 'react-navigation-stack';
 
-export default function App() {
+import Feed from './src/components/Feed'
+import Main from './src/components/Main'
 
-  credentials(); //firebase api key config
-
-  return (
+const AppStack = createStackNavigator({
+
+  FeedRoute: Feed,
+  MainRoute: Main
+
+
+})
+
+export default createAppContainer(createSwitchNavigator({
+
+  App: AppStack
+}));
+
+/*
+export default class App extends Component{
+
+  constructor (){
+    //super()
+    credentials(); //firebase api key config
+  }
+
+  render(){
+    return (
     <View style={styles.container}>
       <Text>updated 7</Text>
+
     </View>
-  );
+    );
+  }
+
 }
 
+*/
+
 const styles = StyleSheet.create({
   container: {
     flex: 1,

database.rules.json

@@ -0,0 +1,6 @@
+{
+  "rules": {
+    ".read": true,
+    ".write": true
+  }
+}

src/components/Feed.js

@@ -0,0 +1,20 @@
+import React, {Component} from 'react';
+import {View, Text, Button} from 'react-native';
+
+import{styles} from '../styles/styles';
+
+export default class Feed extends Component{
+
+    render(){
+
+        return(
+            <View style={styles.center}>
+                <Text> This is the feed</Text>
+                <Button title = 'Go to Main Menu' 
+                        onPress = {()=> this.props.navigation.navigate('MainRoute')} />
+            </View>
+
+        )
+    }
+
+}

src/components/Main.js

@@ -0,0 +1,19 @@
+import React, {Component} from 'react';
+import {View, Text, Button} from 'react-native';
+
+import{styles} from '../styles/styles';
+
+export default class Main extends Component{
+
+    render(){
+
+        return(
+            <View style={styles.center}>
+                <Text> Main Menu </Text>
+                <Button title = 'Go to Feed' onPress = {()=> this.props.navigation.navigate('FeedRoute')} />
+            </View>
+
+        )
+    }
+
+}

src/styles/styles.js

@@ -0,0 +1,11 @@
+import {StyleSheet, Text, View } from 'react-native';
+
+export const styles = StyleSheet.create({
+    container: {
+      flex: 1,
+      backgroundColor: '#fff',
+      alignItems: 'center',
+      justifyContent: 'center',
+    },
+  });
+