firestore databaseにデータを登録しよう

src/router/index.js

@@ -1,7 +1,7 @@
 import Vue from "vue";
 import VueRouter from "vue-router";
 // import HomeView from "../views/HomeView.vue";
-import UserList from "../views/UserList.vue";
+import RoomListView from "../views/roomListView";
 import ChatBoard from "../views/ChatBoard.vue";
 import LoginView from "../views/LoginView.vue";
 import SignupView from "../views/SignupView.vue";
@@ -13,7 +13,7 @@ const routes = [
   {
     path: "/",
     name: "home",
-    component: UserList,
+    component: RoomListView,
     meta: { requiresAuth: true },
   },
   {
@@ -60,16 +60,6 @@ router.beforeEach((to, from, next) => {
     } else {
       next();
     }
-    // firebase.auth().onAuthStateChanged((user) => {
-    //   if (!user) {
-    //     next({
-    //       path: "/login",
-    //       query: { redirect: to.fullPath },
-    //     });
-    //   } else {
-    //     next();
-    //   }
-    // });
   } else {
     next();
   }

src/views/roomListView.vue

@@ -0,0 +1,33 @@
+<template>
+  <v-app id="inspire">
+    <SideBar />
+    <v-app-bar app shrink-on-scroll>
+      <v-toolbar-title>ルーム一覧</v-toolbar-title>
+      <v-spacer></v-spacer>
+      <v-btn icon>
+        <v-icon>mdi-dots-vertical</v-icon>
+      </v-btn>
+    </v-app-bar>
+
+    <v-main>
+      <v-container>
+        <v-row>
+          <v-col v-for="n in 24" :key="n" cols="4">
+            <router-link :to="{ path: 'chat', query: { user_id: n } }">
+              <v-avatar color="grey lighten-2" size="128"></v-avatar>
+            </router-link>
+          </v-col>
+        </v-row>
+      </v-container>
+    </v-main>
+  </v-app>
+</template>
+
+<script>
+import SideBar from "@/components/layouts/SideBar";
+export default {
+  components: {
+    SideBar,
+  },
+};
+</script>