diff --git a/src/components/UserProfileComponents/LargeProfileCard.vue b/src/components/UserProfileComponents/LargeProfileCard.vue
index f8ec7c083c839b58825a4e0e5ac9e7222bc99b21..c3955059409b1a7896ea9d0df93310823f008a57 100644
--- a/src/components/UserProfileComponents/LargeProfileCard.vue
+++ b/src/components/UserProfileComponents/LargeProfileCard.vue
@@ -37,7 +37,7 @@
           </li>
           <li>
             <router-link
-              to=""
+              :to="'/user/' + id + '/groups'"
               class="block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:hover:bg-gray-600 dark:text-gray-200 dark:hover:text-white"
               >Mine grupper
             </router-link>
@@ -51,9 +51,10 @@
           </li>
           <li>
             <div
-                @click="logout"
-                class="cursor-pointer block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:hover:bg-gray-600 dark:text-gray-200 dark:hover:text-white"
-            >Logg ut
+              @click="logout"
+              class="cursor-pointer block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:hover:bg-gray-600 dark:text-gray-200 dark:hover:text-white"
+            >
+              Logg ut
             </div>
           </li>
           <li>
@@ -143,10 +144,10 @@ export default {
       }
       return "../assets/defaultUserProfileImage.jpg";
     },
-    logout(){
-      this.$store.commit('logout');
-      this.$router.push('/')
-    }
+    logout() {
+      this.$store.commit("logout");
+      this.$router.push("/");
+    },
   },
   beforeMount() {
     this.getUser();
diff --git a/src/router/index.js b/src/router/index.js
index aaf73035d6c411fa3070c9ef04d443d321b4de15..c08939d96dda4b8767218915320964be7152b88f 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -89,7 +89,13 @@ const routes = [
     name: "notifications",
     component: () => import("../views/NotificationView.vue"),
     beforeEnter: guardRoute,
-  }
+  },
+  {
+    path: "/user/:id/groups",
+    name: "myGroups",
+    component: () => import("../views/MyGroupsView.vue"),
+    beforeEnter: guardRoute,
+  },
 ];
 
 const router = createRouter({
diff --git a/src/views/MyGroupsView.vue b/src/views/MyGroupsView.vue
new file mode 100644
index 0000000000000000000000000000000000000000..74714cd8414e2285beaca948cf6f243b98877efa
--- /dev/null
+++ b/src/views/MyGroupsView.vue
@@ -0,0 +1,32 @@
+<template>
+  <div>
+    <div id="myGroups">
+      <div>Mine grupper:</div>
+      <group-list :groupList="myGroups" />
+    </div>
+  </div>
+</template>
+
+<script>
+import GroupList from "@/components/GroupeComponents/GroupList.vue";
+import { getMyGroups } from "@/utils/apiutil";
+
+export default {
+  data() {
+    return {
+      myGroups: [],
+    };
+  },
+  components: {
+    GroupList,
+  },
+  methods: {
+    async getMyGroups() {
+      this.myGroups = await getMyGroups();
+    },
+  },
+  beforeMount() {
+    this.getMyGroups();
+  },
+};
+</script>