diff --git a/Mock/AppMockup.tsx b/Mock/AppMockup.tsx
deleted file mode 100644
index 2420d10..0000000
--- a/Mock/AppMockup.tsx
+++ /dev/null
@@ -1,276 +0,0 @@
-import React, { useState } from "react";
-
-// Beispiel-Daten für die Übersicht in der Seitenleiste
-const allItems = [
-  { id: 1, name: "Kamera" },
-  { id: 2, name: "Mikrofon" },
-  { id: 3, name: "Licht-Set" },
-  { id: 4, name: "Stativ" },
-];
-
-// Beispiel-Ausleihen, später per API dynamisch!
-const loans = [
-  {
-    itemId: 1,
-    username: "max",
-    start: "2025-01-01T08:00",
-    end: "2025-01-01T18:00",
-    loanCode: "123456",
-  },
-  {
-    itemId: 3,
-    username: "sara",
-    start: "2025-01-02T10:00",
-    end: "2025-01-02T16:00",
-    loanCode: "654321",
-  },
-];
-
-// Dummy: Für das Beispiel sind einige Items "nicht verfügbar" bei bestimmten Zeiträumen
-function getAvailableItems(start: string, end: string) {
-  if (start.startsWith("2025-01-01")) {
-    return allItems.filter(
-      (item) => item.name === "Kamera" || item.name === "Stativ"
-    );
-  }
-  return allItems;
-}
-
-export default function App() {
-  const [step, setStep] = useState<1 | 2 | 3>(1);
-  const [startDate, setStartDate] = useState("");
-  const [endDate, setEndDate] = useState("");
-  const [availableItems, setAvailableItems] = useState<typeof allItems>([]);
-  const [selectedItem, setSelectedItem] = useState<number | null>(null);
-
-  // Dummy Code für das Design
-  const loanCode = "123456";
-
-  return (
-    <div className="min-h-screen flex bg-gradient-to-r from-blue-50 via-white to-blue-100">
-      {/* Seitenleiste */}
-      <aside className="w-80 min-h-screen bg-white/90 backdrop-blur border-r border-blue-100 shadow-xl flex flex-col p-8">
-        <h2 className="text-2xl font-extrabold mb-6 text-blue-700 tracking-tight flex items-center gap-2">
-          <svg
-            className="w-7 h-7 text-blue-500"
-            fill="none"
-            stroke="currentColor"
-            strokeWidth={2}
-            viewBox="0 0 24 24"
-          >
-            <path
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              d="M16.5 7.5V4.75A2.25 2.25 0 0 0 14.25 2.5h-4.5A2.25 2.25 0 0 0 7.5 4.75V7.5m9 0h-9m9 0v11.75A2.25 2.25 0 0 1 14.25 21.5h-4.5A2.25 2.25 0 0 1 7.5 19.25V7.5m9 0h-9"
-            />
-          </svg>
-          Ausleih-Übersicht
-        </h2>
-        <ul className="space-y-5 flex-1">
-          {allItems.map((item) => {
-            const itemLoans = loans.filter((loan) => loan.itemId === item.id);
-            return (
-              <li
-                key={item.id}
-                className="bg-white/80 rounded-xl p-4 shadow hover:shadow-md transition"
-              >
-                <div className="font-semibold text-gray-900 flex items-center gap-2">
-                  <span
-                    className="inline-block w-2 h-2 rounded-full"
-                    style={{
-                      background:
-                        itemLoans.length === 0 ? "#34d399" : "#60a5fa",
-                    }}
-                  ></span>
-                  {item.name}
-                </div>
-                {itemLoans.length === 0 ? (
-                  <div className="text-green-500 text-xs mt-1 font-medium">
-                    Verfügbar
-                  </div>
-                ) : (
-                  <ul className="mt-2 space-y-1">
-                    {itemLoans.map((loan, idx) => (
-                      <li
-                        key={idx}
-                        className="text-xs text-blue-800 bg-blue-100/60 p-1 rounded"
-                      >
-                        <span className="font-bold">{loan.username}</span>
-                        <span className="ml-2">
-                          {formatDateTime(loan.start)} –{" "}
-                          {formatDateTime(loan.end)}
-                        </span>
-                        <span className="ml-2 text-gray-400">
-                          ({loan.loanCode})
-                        </span>
-                      </li>
-                    ))}
-                  </ul>
-                )}
-              </li>
-            );
-          })}
-        </ul>
-        <div className="mt-10 text-xs text-gray-400 flex items-center gap-4">
-          <span className="inline-block w-3 h-3 bg-green-400 rounded-full mr-1"></span>
-          Verfügbar
-          <span className="inline-block w-3 h-3 bg-blue-400 rounded-full ml-4 mr-1"></span>
-          Verliehen
-        </div>
-      </aside>
-
-      {/* Hauptbereich */}
-      <main className="flex-1 flex flex-col items-center py-14 px-4">
-        <header className="mb-12">
-          <h1 className="text-4xl font-extrabold text-blue-800 tracking-tight drop-shadow-sm">
-            Gegenstand ausleihen
-          </h1>
-          <p className="text-blue-400 mt-2 text-lg font-medium">
-            Schnell und unkompliziert Equipment reservieren
-          </p>
-        </header>
-        <div className="bg-white/90 shadow-2xl rounded-3xl p-10 w-full max-w-xl ring-1 ring-blue-100">
-          {step === 1 && (
-            <form
-              className="space-y-6"
-              onSubmit={(e) => {
-                e.preventDefault();
-                setAvailableItems(getAvailableItems(startDate, endDate));
-                setStep(2);
-              }}
-            >
-              <h2 className="text-xl font-bold mb-2 text-blue-700">
-                1. Zeitraum wählen
-              </h2>
-              <div>
-                <label className="block font-medium mb-1 text-blue-900">
-                  Startdatum
-                </label>
-                <input
-                  type="datetime-local"
-                  className="w-full border border-blue-200 rounded-lg px-3 py-2 focus:ring-2 focus:ring-blue-400 focus:outline-none"
-                  value={startDate}
-                  onChange={(e) => setStartDate(e.target.value)}
-                  required
-                />
-              </div>
-              <div>
-                <label className="block font-medium mb-1 text-blue-900">
-                  Enddatum
-                </label>
-                <input
-                  type="datetime-local"
-                  className="w-full border border-blue-200 rounded-lg px-3 py-2 focus:ring-2 focus:ring-blue-400 focus:outline-none"
-                  value={endDate}
-                  onChange={(e) => setEndDate(e.target.value)}
-                  required
-                  min={startDate}
-                />
-              </div>
-              <button
-                type="submit"
-                className="w-full bg-gradient-to-r from-blue-600 to-blue-400 hover:from-blue-700 hover:to-blue-500 text-white font-bold py-2 px-4 rounded-xl shadow transition disabled:bg-gray-300"
-                disabled={!startDate || !endDate || endDate <= startDate}
-              >
-                Verfügbare Gegenstände anzeigen
-              </button>
-            </form>
-          )}
-
-          {step === 2 && (
-            <div>
-              <h2 className="text-xl font-bold mb-6 text-blue-700">
-                2. Gegenstand auswählen
-              </h2>
-              {availableItems.length === 0 ? (
-                <div className="text-red-600 mb-8 font-medium text-center">
-                  Keine Gegenstände verfügbar für diesen Zeitraum.
-                </div>
-              ) : (
-                <ul className="mb-8 space-y-3">
-                  {availableItems.map((item) => (
-                    <li
-                      key={item.id}
-                      className={`flex justify-between items-center p-4 rounded-xl shadow-sm border ${
-                        selectedItem === item.id
-                          ? "bg-blue-100 border-blue-400"
-                          : "bg-green-50 border-green-100 hover:bg-blue-50"
-                      } transition`}
-                    >
-                      <span className="font-medium text-lg">{item.name}</span>
-                      <button
-                        className={`px-4 py-1 rounded-lg bg-gradient-to-r from-blue-500 to-blue-400 text-white text-sm font-semibold shadow hover:from-blue-600 hover:to-blue-500 ${
-                          selectedItem === item.id ? "ring-2 ring-blue-400" : ""
-                        }`}
-                        onClick={() => setSelectedItem(item.id)}
-                      >
-                        {selectedItem === item.id ? "Ausgewählt" : "Auswählen"}
-                      </button>
-                    </li>
-                  ))}
-                </ul>
-              )}
-              <div className="flex justify-between">
-                <button
-                  className="px-5 py-2 bg-gray-100 text-gray-600 rounded-xl hover:bg-gray-200 font-semibold shadow"
-                  onClick={() => setStep(1)}
-                >
-                  Zurück
-                </button>
-                <button
-                  className="px-5 py-2 bg-gradient-to-r from-blue-600 to-blue-400 text-white rounded-xl hover:from-blue-700 hover:to-blue-500 font-bold shadow transition disabled:bg-gray-300"
-                  disabled={selectedItem === null}
-                  onClick={() => setStep(3)}
-                >
-                  Ausleihen
-                </button>
-              </div>
-            </div>
-          )}
-
-          {step === 3 && (
-            <div className="mt-2 p-8 bg-blue-50/80 border border-blue-200 rounded-2xl text-center shadow-lg">
-              <h3 className="font-extrabold text-blue-700 mb-3 text-2xl">
-                Ausleihe bestätigt!
-              </h3>
-              <p className="mb-2 text-lg">
-                Ihr Ausleih-Code lautet:{" "}
-                <span className="font-mono text-2xl text-blue-900 bg-white px-2 py-1 rounded shadow">
-                  {loanCode}
-                </span>
-              </p>
-              <p className="mt-2 text-blue-600 text-sm">
-                Bitte merken Sie sich diesen Code, um das Schließfach zu öffnen.
-              </p>
-              <button
-                className="mt-8 px-6 py-2 bg-gradient-to-r from-blue-600 to-blue-400 text-white rounded-xl hover:from-blue-700 hover:to-blue-500 font-bold shadow"
-                onClick={() => {
-                  setStep(1);
-                  setStartDate("");
-                  setEndDate("");
-                  setSelectedItem(null);
-                }}
-              >
-                Neue Ausleihe
-              </button>
-            </div>
-          )}
-        </div>
-      </main>
-    </div>
-  );
-}
-
-// Hilfsfunktion: Datumsformatierung (z.B. 01.01.2025 08:00)
-function formatDateTime(dt: string) {
-  const d = new Date(dt);
-  return (
-    d.toLocaleDateString("de-DE", {
-      day: "2-digit",
-      month: "2-digit",
-      year: "numeric",
-    }) +
-    " " +
-    d.toLocaleTimeString("de-DE", { hour: "2-digit", minute: "2-digit" })
-  );
-}
diff --git a/Mock/frontendMockData.json b/Mock/frontendMockData.json
deleted file mode 100644
index ad18127..0000000
--- a/Mock/frontendMockData.json
+++ /dev/null
@@ -1,20 +0,0 @@
-[
-    {
-        "id": 1,
-        "title": "Mock Book 1",
-        "author": "Author 1",
-        "description": "Description for Mock Book 1"
-    },
-    {
-        "id": 2,
-        "title": "Mock Book 2",
-        "author": "Author 2",
-        "description": "Description for Mock Book 2"
-    },
-    {
-        "id": 3,
-        "title": "Mock Book 3",
-        "author": "Author 3",
-        "description": "Description for Mock Book 3"
-    }
-]
\ No newline at end of file
diff --git a/docker-compose.yml b/docker-compose.yml
index a515096..6d6cd5d 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -1,13 +1,13 @@
 services:
   #  borrow_system-frontend:
   #    container_name: borrow_system-frontend
-  #    build: ./frontend
+  #    build: ./FrontendV2
   #    ports:
   #      - "8001:8001"
   #    environment:
   #      - CHOKIDAR_USEPOLLING=true
   #    volumes:
-  #      - ./frontend:/app
+  #      - ./FrontendV2:/app
   #      - /app/node_modules
   #    restart: unless-stopped
 
diff --git a/other/data_structure.xlsx b/other/data_structure.xlsx
deleted file mode 100644
index db5f717..0000000
Binary files a/other/data_structure.xlsx and /dev/null differ