diff --git a/src/components/ProtectedData.vue b/src/components/ProtectedData.vue
index 49108f0..a096b8a 100644
--- a/src/components/ProtectedData.vue
+++ b/src/components/ProtectedData.vue
@@ -1,18 +1,29 @@
 <script lang="ts">
 import { defineComponent, onMounted, ref } from 'vue';
-import { useUserStore } from 'stores/user-store';
+
 import { useRouter } from 'vue-router';
-import { ptpUser } from 'src/models';
+import { useUserStore } from 'stores/user-store';
+import { useChatStore } from 'stores/chat-store';
+
+import { ptpUser, chat } from 'src/models';
 
 export default defineComponent({
   name: 'ProtectedData',
   components: {},
   setup() {
     const userStore = useUserStore();
+    const chatStore = useChatStore();
     const router = useRouter();
 
     const user = ref();
     const userLoaded = ref(false);
+
+    const chatName = ref('');
+
+    const chats = ref([] as chat[]);
+    const chatsLoaded = ref(false);
+
+
     const logout = () => {
       userStore.logout();
       router.push('/');
@@ -24,6 +35,20 @@ export default defineComponent({
       usersLoaded.value = true;
       users.value = userStore.users;
     }
+
+    const createChat = async(chatName: string)=>{
+      await chatStore.createChat(chatName, userStore.users.map(u => u.keycloakID));
+    }
+
+    const loadChats = async() => {
+      chats.value = await chatStore.loadChatsByUser();
+      chatsLoaded.value = true;
+
+      users.value = await userStore.loadAllUsers();
+      usersLoaded.value = true;
+      console.log(users.value);
+      console.log(chats.value);
+    }
     onMounted(async () => {
       userLoaded.value = userStore.userLoaded;
       user.value = userStore.user;
@@ -32,10 +57,19 @@ export default defineComponent({
     return {
       user,
       userLoaded,
+
       logout,
+
       loadUsers,
       users,
-      usersLoaded
+      usersLoaded,
+
+      chatName,
+      createChat,
+
+      loadChats,
+      chats,
+      chatsLoaded,
     };
   },
 })
@@ -61,6 +95,20 @@ export default defineComponent({
       <p>{{ user.keycloakID }}</p>
     </div>
   </div>
+  <br>
+  <q-input v-model="chatName" label="Chat Name" clearable />
+  <q-btn @click="createChat(chatName)" label="Create Chat"/>
+  <br>
+  <q-btn @click="loadChats()" label="Load Chats"/>
+  <div v-if="chatsLoaded">
+    <p>Chats:</p>
+    <div v-for="chat in chats" :key="chat.id">
+      <h5>{{ chat.displayName }}</h5>
+      <div v-for="ptpUser in chat.members" :key="ptpUser.keycloakID">
+        <p>{{ ptpUser.keycloakID }}</p>
+      </div>
+    </div>
+  </div>
 </template>
 
 <style scoped>
diff --git a/src/models.ts b/src/models.ts
index 3da2788..cde9182 100644
--- a/src/models.ts
+++ b/src/models.ts
@@ -10,3 +10,26 @@ export interface responseModel {
   message: string;
   response: any;
 }
+
+export interface chat{
+  id: number;
+  members: ptpUser[];
+  messages: message[];
+  displayName: string;
+}
+
+export interface user{
+  id: number;
+  keycloakID: string;
+  firstName: string;
+  lastName: string;
+  username: string;
+  chats: chat[];
+}
+
+export interface message{
+  id: number;
+  chat: chat;
+  sender: user;
+  content: string;
+}
diff --git a/src/stores/chat-store.ts b/src/stores/chat-store.ts
new file mode 100644
index 0000000..297f64f
--- /dev/null
+++ b/src/stores/chat-store.ts
@@ -0,0 +1,27 @@
+import { defineStore } from 'pinia';
+import { chat } from 'src/models';
+import { api } from 'src/boot/axios';
+import { useUserStore } from 'stores/user-store';
+
+const userStore = useUserStore();
+
+export const useChatStore = defineStore('chatStore',{
+  state:() => ({
+    chats: [] as chat[],
+  }),
+  actions: {
+    async getChatsByUser(): Promise<chat[]> {
+      if(!this.chats){
+        await this.loadChatsByUser();
+      }
+      return this.chats;
+    },
+    async loadChatsByUser() : Promise<chat[]>{
+      this.chats = (await api.get("/users/chat/" + userStore.keycloakId)).data.response;
+      return this.chats;
+    },
+    async createChat(chatName: string, members: string[]){
+      return (await api.post("/chats/create/" + chatName, members)).data;
+    }
+  }
+});
diff --git a/src/stores/user-store.ts b/src/stores/user-store.ts
index 3069d12..040ff54 100644
--- a/src/stores/user-store.ts
+++ b/src/stores/user-store.ts
@@ -3,6 +3,29 @@ import { api } from 'src/boot/axios';
 import { ptpUser, responseModel } from 'src/models';
 import Keycloak, { KeycloakInitOptions, KeycloakLoginOptions } from 'keycloak-js';
 
+/**
+ * Variablen für Keycloak Funktionen; sind in quasar.config.js definiert.
+ * @param keycloakPort Port, auf dem Keycloak läuft, hinterlegt in docker-compose.yml
+ * @param frontendPort Port, auf dem das Frontend läuft, hinterlegt in quasar.config.js und realm-export.json von Keycloak für die Redirect-URL
+ * @param realm Name des Realms, hinterlegt in realm-export.json von Keycloak
+ * @param clientId Name des Clients, hinterlegt in realm-export.json von Keycloak
+ */
+const keycloakPort: string = "" + process.env.PORT_KEYCLOAK;
+const frontendPort: string = "" + process.env.PORT_FRONTEND;
+const realm : string= "" + process.env.KEYCLOAK_REALM;
+const clientId: string = "" + process.env.KEYCLOAK_CLIENT_ID;
+const keycloak: Keycloak = new Keycloak({
+  url: 'http://localhost:' + keycloakPort + '/',
+  realm: realm,
+  clientId: clientId
+});
+const initOptions: KeycloakInitOptions = {
+  onLoad: 'login-required', //erzwingt Login
+  redirectUri: 'http://localhost:' + frontendPort + '/',
+  checkLoginIframe: false,
+  locale: 'login-required',
+}
+
 export const useUserStore = defineStore('userStore', {
   state: () => ({
     user: null as ptpUser | null,
@@ -11,7 +34,6 @@ export const useUserStore = defineStore('userStore', {
     keycloakId: "",
     users: [] as ptpUser[],
   }),
-  getters: {},
   actions: {
     async getPtpUserByKeycloakID(keycloakID : string) {
       await this.loadPtpUsersByKeycloakID(keycloakID).then((response : responseModel) => {
@@ -22,32 +44,12 @@ export const useUserStore = defineStore('userStore', {
     async loadPtpUsersByKeycloakID(keycloakID : string) : Promise<responseModel>  {
       return (await api.get("/users/login/"+keycloakID)).data;
     },
-    async loadAllUsers(){
+    async loadAllUsers(): Promise<ptpUser[]> {
       this.users = (await api.get("/users/user")).data;
+      return this.users;
     },
-    async initKeycloak() {
-      /**
-       * Variablen sind in quasar.config.js definiert und werden hier verwendet.
-       * @param keycloakPort Port, auf dem Keycloak läuft, hinterlegt in docker-compose.yml
-       * @param frontendPort Port, auf dem das Frontend läuft, hinterlegt in quasar.config.js und realm-export.json von Keycloak für die Redirect-URL
-       * @param realm Name des Realms, hinterlegt in realm-export.json von Keycloak
-       * @param clientId Name des Clients, hinterlegt in realm-export.json von Keycloak
-       */
-      const keycloakPort: string = "" + process.env.PORT_KEYCLOAK;
-      const frontendPort: string = "" + process.env.PORT_FRONTEND;
-      const realm : string= "" + process.env.KEYCLOAK_REALM;
-      const clientId: string = "" + process.env.KEYCLOAK_CLIENT_ID;
-      const keycloak: Keycloak = new Keycloak({
-        url: 'http://localhost:' + keycloakPort + '/',
-        realm: realm,
-        clientId: clientId
-      });
-      const initOptions: KeycloakInitOptions = {
-        onLoad: 'login-required', //erzwingt Login
-        redirectUri: 'http://localhost:' + frontendPort + '/',
-        checkLoginIframe: false,
-        locale: 'login-required',
-      }
+    async initKeycloak() : Promise<Keycloak>{
+
       try {
         await keycloak.init(initOptions).then( (auth: boolean): void => {
           console.log("Authenticated: " + auth);
@@ -64,7 +66,7 @@ export const useUserStore = defineStore('userStore', {
       }else await this.keycloak?.login( {prompt: 'login'} as KeycloakLoginOptions);
     },
     async logout() {
-      window.location.href= 'http://localhost:' + process.env.PORT_KEYCLOAK + '/realms/' + process.env.KEYCLOAK_REALM + '/protocol/openid-connect/logout?post_logout_redirect_uri=http%3A%2F%2Flocalhost:' + process.env.PORT_FRONTEND + '&client_id=' + process.env.KEYCLOAK_CLIENT_ID;
-    }
+      window.location.href= 'http://localhost:' + keycloakPort + '/realms/' + realm + '/protocol/openid-connect/logout?post_logout_redirect_uri=http%3A%2F%2Flocalhost:' + frontendPort + '&client_id=' + clientId;
+    },
   },
 });