page for list of rooms

frontend/src/components/HomePage.vue

@@ -0,0 +1,27 @@
+<script setup lang="ts">
+import { onBeforeMount, ref } from 'vue';
+
+const rooms = ref();
+
+defineEmits(['addSlot']);
+onBeforeMount(async () => {
+    const res = await fetch("http://localhost:3000/currentRooms", {
+        method: "GET",
+        headers: new Headers({'content-type': 'application/json'})
+    });
+    rooms.value = await res.json();
+});
+</script>
+<template>
+    <header>
+        <h1>What's free in my free?</h1>
+        <button @click="$emit('addSlot')">Add new slot</button>
+    </header>
+    <article>
+        <h2>Free Rooms:</h2>
+        <p v-if="rooms.records.length == 0">No free rooms right now</p>
+        <ul v-for="(slot, index) in rooms.records">
+            <li :id="index">{{ slot }}</li>
+        </ul>
+    </article>
+</template>