diff --git a/index.html b/index.html
index 9a4780d..1c740bd 100644
--- a/index.html
+++ b/index.html
@@ -2,7 +2,6 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/png" href="RitzenbergenOrtsschild.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Willkommen auf ritzenbergen.de</title>
     
@@ -18,8 +17,7 @@
     </noscript>
     <link rel="stylesheet"
       href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0" />
-		<script src="http://192.168.188.38/Jonas/ritzenbergenapi/addhit.php">
-		</script>
+		<!-- <script src="http://192.168.188.38/Jonas/ritzenbergenapi/addhit.php"></script> -->
 
   </head>
 
diff --git a/package.json b/package.json
index e4feeee..e5f97d8 100644
--- a/package.json
+++ b/package.json
@@ -19,6 +19,7 @@
     "bcryptjs": "^3.0.3",
     "crypto-js": "^4.2.0",
     "embla-carousel-vue": "^8.6.0",
+    "graphql-request": "^7.4.0",
     "jarallax": "^2.2.1",
     "jquery": "^3.7.1",
     "katex": "^0.16.27",
diff --git a/src/components/startseite/Events.vue b/src/components/startseite/Events.vue
index 45232f2..b267d1c 100644
--- a/src/components/startseite/Events.vue
+++ b/src/components/startseite/Events.vue
@@ -1,126 +1,58 @@
-<script lang="ts">
-import RitzenbergenLib from "../../ritzenbergenlib.ts";
-import striptags from "striptags";
-import moment, { Moment } from "moment";
+<script lang="ts" setup>
+import RitzenbergenLib from "../../ritzenbergenlib";
 import Modal from "../Modal.vue";
-import $ from "jquery";
 import MarkdownRender from "vue-renderer-markdown";
 import "katex/dist/katex.min.css";
 import Forms from "./Forms.vue";
+import { ref } from "vue";
+import { EventType, MyEvent } from "../../dto/event.dto.js";
 
-export default {
-	data() {
-		const openedModals: number[] = [];
-		return {
-			openedModals,
-			modaltypes: ["markdown", "html"],
-			RitzenbergenLib: RitzenbergenLib.RitzenbergenLib,
-		};
-	},
-	computed: {
-		events() {
-			let result: Array<any> = [];
+const initdone=ref(false);
 
-			$.ajax(RitzenbergenLib.RitzenbergenLib.api("get_events.php"), {
-				crossDomain: true,
-				async: false,
-				success: function (data: string) {
-					result = JSON.parse(data);
-				},
-				error: function () {
-						result=false;
-				}
-			});
-			return result;
-			/*
-      Beispiel-Event-Array:
-      [
-        {
-          id: 0,
-          eventname: "Eventname",
-          datum: "2009-04-06",
-          type: "markdown",
-          content: "# Test",
-          link: undefined,
-          foto: "erntefest/2011/pic08.jpg",
-					minitext: "",
-					formular: 1 
-        },
-        {
-          id: 1,
-          eventname: "Link",
-          datum: "2009-04-06",
-          type: "link",
-          content: "<h1>Testlink</h1>",
-          link: "#/test",
-          foto: "erntefest/2011/pic08.jpg",
-					minitext: ""
-        },
-        },
-        {
-          id: 2,
-          eventname: "Download-Link",
-          datum: "2009-04-06",
-          type: "dlink",
-          content: "<h1>Testlink2</h1>",
-          link: "/",
-          foto: "erntefest/2011/pic08.jpg",
-					minitext: ""
-        },
-        },
-        {
-          id: 3,
-          eventname: "Fotos endlich online!",
-          datum: "2009-04-06",
-          type: "fotos",
-          content: "Fotos vom Erntefest 2011",
-          link: "erntefest/2011",
-          foto: "erntefest/2011/pic08.jpg",
-					minitext: ""
-        },
-        },
-        {
-          id: 4,
-          eventname: "Eventname",
-          datum: "2009-04-06",
-          type: "html",
-          content: "<h1>Test2</h1>",
-          link: undefined,
-          foto: "erntefest/2011/pic08.jpg",
-					minitext: ""
-        },
-        },
-      ];*/
-		},
-	},
-	methods: {
-		vorschautext(content: string) {
-			const stripped = striptags(content);
-			const vorschaulen = 30;
-			if (stripped.length > vorschaulen) {
-				return stripped.substring(0, vorschaulen) + "...";
-			} else {
-				return stripped;
-			}
-		},
-		format_date(date: string) {
-			const mymoment: Moment = moment(date);
+const events = ref<MyEvent[]>([]);
+
+const openedModals=ref<number[]>([]);
+
+const modaltypes=[EventType.html,EventType.markdown];
+
+async function init() {
+	
+	events.value=(await RitzenbergenLib.graphqlClient.request<{events: MyEvent[]}>
+(`{
+	events {
+		id
+		eventname
+		type
+		minitext
+		datum
+		content
+		link
+		foto
+		formular
+	}
+}`)).events;
+	console.log(events.value);
+
+	
+}
+
+init().then(()=>{
+
+	initdone.value=true;
+
+});
+
+function format_date(date: string){
+	return new Date(date).toDateString();
+}
+
+function vorschautext(str: string){
+	return str;
+}
 
-			return mymoment.format("DD.MM.YYYY");
-		},
-		galerie(content: string) {
-			this.$router.push({ path: "/bild/" + content });
-		},
-	},
-	components: {
-		Modal,
-		MarkdownRender,
-		Forms
-	},
-};
 </script>
 <template>
-	<section class="features03 cid-u6k7q0xyDG" id="news-1-u6k7q0xyDG">
+	<section class="features03 cid-u6k7q0xyDG" id="news-1-u6k7q0xyDG" v-if="initdone">
 		<div class="container-fluid">
 			<div class="row justify-content-center mb-5">
 				<div class="col-12 content-head">
@@ -159,7 +91,7 @@ export default {
 						"
 					>
 						<MarkdownRender
-							v-if="event.type == 'markdown'"
+							v-if="event.type == EventType.markdown"
 							:content="event.content"
 						/>
 						<div v-else v-html="event.content"></div>
@@ -168,7 +100,7 @@ export default {
 
 					<div class="item-wrapper">
 						<div class="item-img mb-3">
-							<img :src="RitzenbergenLib.get_img(event.foto)" />
+							<img :src="RitzenbergenLib.RitzenbergenLib.get_img(event.foto)" />
 						</div>
 						<div class="item-content align-left">
 							<h6
diff --git a/src/dto b/src/dto
index 669bc47..3798232 160000
--- a/src/dto
+++ b/src/dto
@@ -1 +1 @@
-Subproject commit 669bc47276e5566bc1929014d19cfa8ce1922ad8
+Subproject commit 3798232611ef6358d81612c846354637170bf3cd
diff --git a/src/ritzenbergenlib.ts b/src/ritzenbergenlib.ts
index a283a73..ea2eaeb 100644
--- a/src/ritzenbergenlib.ts
+++ b/src/ritzenbergenlib.ts
@@ -1,5 +1,12 @@
 import $ from "jquery";
 import { ref } from "vue";
+import { GraphQLClient } from 'graphql-request';
+
+const graphqlClient = new GraphQLClient('http://localhost:3000/graphql', {
+  headers: {
+    // optional: Authorization: 'Bearer TOKEN'
+  },
+});
 
 const apiBaseUrl = import.meta.env.VITE_BACKEND_URL;
 
@@ -308,4 +315,5 @@ export default {
 	Spiel,
 	Formular,
 	Field,
+	graphqlClient
 };
diff --git a/src/views/Main.vue b/src/views/Main.vue
index adc3a1f..2976527 100644
--- a/src/views/Main.vue
+++ b/src/views/Main.vue
@@ -4,7 +4,7 @@ import Modal from "../components/Modal.vue";
 import Embla from "../components/Embla.vue";
 import Umgebung from "../components/startseite/Umgebung.vue";
 import MyFooter from "../components/MyFooter.vue"; // Geändert von Footer auf MyFooter
-import RitzenbergenLib from "../ritzenbergenlib.ts";
+import RitzenbergenLib from "../ritzenbergenlib";
 import WillkommenText from "../components/startseite/WillkommenText.vue";
 import Bilderbuch from "../components/startseite/Bilderbuch.vue";
 import Forms from "../components/startseite/Forms.vue";
@@ -29,18 +29,18 @@ async function loadImage(path: string) {
 }
 }
 
-loadImage("randomimage.php?path=/doppelkopf&recursive=1&tn=1&color=white&text=Doppelkopf&size=3").then((url)=>{
-		images.value[0]=url;
-});
-loadImage("randomimage.php?path=/erntefest&recursive=1&tn=1&color=white&text=Erntefest&size=3").then((url)=>{
-		images.value[1]=url;
-});
-loadImage("randomimage.php?path=/fussball&recursive=1&tn=1&color=white&text=Fußballturnier&size=3").then((url)=>{
-		images.value[2]=url;
-});
-loadImage("randomimage.php?path=/osterfeuer&recursive=1&tn=1&color=white&text=Osterfeuer&size=3").then((url)=>{
-		images.value[3]=url;
-});
+// loadImage("randomimage.php?path=/doppelkopf&recursive=1&tn=1&color=white&text=Doppelkopf&size=3").then((url)=>{
+// 		images.value[0]=url;
+// });
+// loadImage("randomimage.php?path=/erntefest&recursive=1&tn=1&color=white&text=Erntefest&size=3").then((url)=>{
+// 		images.value[1]=url;
+// });
+// loadImage("randomimage.php?path=/fussball&recursive=1&tn=1&color=white&text=Fußballturnier&size=3").then((url)=>{
+// 		images.value[2]=url;
+// });
+// loadImage("randomimage.php?path=/osterfeuer&recursive=1&tn=1&color=white&text=Osterfeuer&size=3").then((url)=>{
+// 		images.value[3]=url;
+// });
 
 </script>
 
@@ -52,14 +52,14 @@ loadImage("randomimage.php?path=/osterfeuer&recursive=1&tn=1&color=white&text=Os
   
   <Events style="margin-top: 120px;"/>
 
-  <Forms/>
+  <!-- <Forms/> -->
       
 
-  <Bilderbuch/>
+  <!-- <Bilderbuch/> -->
 
 
 
-	<section class="slider4 mbr-embla cid-u6k7q0yLdW" id="gallery-13-u6k7q0yLdW" v-if="images[0]">
+	<!-- <section class="slider4 mbr-embla cid-u6k7q0yLdW" id="gallery-13-u6k7q0yLdW" v-if="images[0]">
     <div class="container-fluid">
       <div class="row">
         <div class="col-12">
@@ -86,7 +86,7 @@ loadImage("randomimage.php?path=/osterfeuer&recursive=1&tn=1&color=white&text=Os
 
 
   <br>
-  <br>
+  <br> -->
 
 
   <Umgebung ref="umgebung" />
