added profile page and got query working on homepage

final/src/App.vue

@@ -3,6 +3,7 @@
     <div id="nav">
       <router-link to="/">Home</router-link> |
       <router-link to="/about"><img class="navImg" src="./assets/prof-link-placeholder.png"></router-link> |
+      <router-link to="/profile">Profile</router-link> |
       <router-link to="/login" v-if="!authenticated">Log in</router-link>
       <a href="#" v-if="authenticated" @click="$store.dispatch('signOut')"><img class="navImg" src="./assets/logout-placeholder.png"></a>
       <div id="navSidebar">
@@ -24,8 +25,6 @@
 
 </template>
 
-<script src="https://www.gstatic.com/firebasejs/7.14.2/firebase-app.js"></script>
-<script src="https://www.gstatic.com/firebasejs/7.14.2/firebase-firestore.js"></script>
 <script>
 
 export default {

final/src/main.js

@@ -38,12 +38,12 @@ new Vue({
   }
 }).$mount('#app')
 
-var posts = new Vue ({
-  el: '#postList',
-  data: {
-    posts: [
-    { message: 'first' },
-    { message: 'second' },
-    { message: 'third' }],
-  },
-});
+// var posts = new Vue ({
+//   el: '#postList',
+//   data: {
+//     posts: [
+//     { message: 'first' },
+//     { message: 'second' },
+//     { message: 'third' }],
+//   },
+// });

final/src/router.js

@@ -9,6 +9,7 @@ import store from './store';
 import Home from './views/Home.vue'
 import About from './views/About.vue'
 import Login from './views/Login.vue'
+import Profile from './views/Profile.vue'
 
 
 Vue.use(Router)
@@ -27,11 +28,15 @@ const router = new Router({
       name: 'home',
       component: Home
     },    
-
     {
       path: '/about',
       name: 'about',
       component: About
+    },
+    {
+      path: '/profile',
+      name: 'profile',
+      component: Profile
     }
   ]
 });

final/src/views/Home.vue

@@ -1,7 +1,11 @@
 <template>
   <div class="home">
+
+    <ul id="postList">
+      <li v-for="(post, name, index) in posts" :key=index>{{ post.message }}</li>
+    </ul>
 
-    <PlaceholderTweets msg="still works?"/>
+    <!-- <PlaceholderTweets msg="still works?"/> -->
 
   </div>
 
@@ -10,15 +14,38 @@
 <script>
 // @ is an alias to /src
 
-import PlaceholderTweets from '@/components/PlaceholderTweets.vue'
+// import PlaceholderTweets from '@/components/PlaceholderTweets.vue'
 
 export default {
   name: 'home',
+  data: function(){
+    return {
+      posts: []
+    }
+  },
   components: {
-    PlaceholderTweets
+    // PlaceholderTweets
+  },
+
+  methods: {
+    getPosts(){
+      db.collection("posts").get().then(querySnapshot => {
+          querySnapshot.forEach( doc => {
+              // doc.data() is never undefined for query doc snapshots
+              console.log(doc.id, " => ", doc.data());
+              this.posts.unshift(doc.data())
+          });
+      }); 
+    }
+
   },
+
+  // This runs when the page loads
   mounted() {
     // console.log(db);
+
+    this.getPosts();
+
   }
 };
 </script>

final/src/views/Profile.vue

@@ -0,0 +1,38 @@
+<template>
+  <div class="about">
+    <h1>This is the profile page</h1>
+    <div>
+      {{ $store.state.user }}
+
+    </div>
+  </div>
+
+</template>
+
+
+<script>
+// @ is an alias to /src
+
+
+export default {
+  name: 'profile',
+  data: function(){
+    return {
+
+    }
+  },
+
+
+  methods: {
+
+
+  },
+
+  // This runs when the page loads
+  mounted() {
+    // console.log(db);
+    console.log(this.$store.state.user)
+
+  }
+};
+</script>