diff --git a/anzeigen-backend/src/main/java/de/muenchen/anzeigenportal/swbrett/users/controller/UserController.java b/anzeigen-backend/src/main/java/de/muenchen/anzeigenportal/swbrett/users/controller/UserController.java
index 7682a2cd..edd84098 100644
--- a/anzeigen-backend/src/main/java/de/muenchen/anzeigenportal/swbrett/users/controller/UserController.java
+++ b/anzeigen-backend/src/main/java/de/muenchen/anzeigenportal/swbrett/users/controller/UserController.java
@@ -2,12 +2,14 @@
 
 import de.muenchen.anzeigenportal.swbrett.users.model.SwbUserTO;
 import de.muenchen.anzeigenportal.swbrett.users.service.UserService;
+import lombok.extern.slf4j.Slf4j;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.http.HttpStatus;
 import org.springframework.web.bind.annotation.*;
 
 import java.util.Optional;
 
+@Slf4j
 @RestController
 @RequestMapping("/users")
 public class UserController {
@@ -24,18 +26,17 @@ public SwbUserTO getUser(@PathVariable("userId") final long userId) {
     /**
      * Put Method to encrypt the email with https.
      *
-     * @param email
+     * @param lhmObjectId unique description in keycloak for every user
      * @return SwbUserTO with id, if user found. id = null if no user found
      */
     @PutMapping("/find")
     @ResponseStatus(HttpStatus.OK)
-    public SwbUserTO findUser(@RequestBody final String email) {
-        final Optional<SwbUserTO> userTO = service.findUser(email);
-        if (userTO.isPresent()) {
-            return userTO.get();
-        } else {
-            return new SwbUserTO();
-        }
+    public SwbUserTO findUser(@RequestBody final String lhmObjectId) {
+        String sanitizedId = lhmObjectId.replace("\"", ""); // Entfernt Anführungszeichen
+        sanitizedId = sanitizedId.replaceAll("[\\r\\n]", ""); // Entfernt Zeilenumbrüche
+        final Optional<SwbUserTO> userTO = service.findUser(sanitizedId);
+        log.debug("CONTROLLER | findUser with lhmObjectID: {} was: {}", sanitizedId, userTO.isPresent());
+        return userTO.orElseGet(SwbUserTO::new);
     }
 
     @PostMapping()
diff --git a/anzeigen-backend/src/main/java/de/muenchen/anzeigenportal/swbrett/users/service/UserService.java b/anzeigen-backend/src/main/java/de/muenchen/anzeigenportal/swbrett/users/service/UserService.java
index 02391cc3..ddfd7aab 100644
--- a/anzeigen-backend/src/main/java/de/muenchen/anzeigenportal/swbrett/users/service/UserService.java
+++ b/anzeigen-backend/src/main/java/de/muenchen/anzeigenportal/swbrett/users/service/UserService.java
@@ -33,11 +33,7 @@ public SwbUserTO getUser(final long id) {
     public Optional<SwbUserTO> findUser(final String lhmObjectId) {
         final Optional<SwbUser> user = repository.findByLhmObjectId(lhmObjectId);
 
-        if (user.isPresent()) {
-            return Optional.of(mapper.toSwbUserTO(user.get()));
-        } else {
-            return Optional.empty();
-        }
+        return user.map(swbUser -> mapper.toSwbUserTO(swbUser));
     }
 
     public SwbUserTO createUser(final SwbUserTO userTO) {
diff --git a/anzeigen-frontend/src/Constants.ts b/anzeigen-frontend/src/Constants.ts
index 457aaa28..84d770ff 100644
--- a/anzeigen-frontend/src/Constants.ts
+++ b/anzeigen-frontend/src/Constants.ts
@@ -18,3 +18,8 @@ export const EV_SNACKBAR = "eventbus-snackbar";
  */
 export const API_ERROR_MSG =
   "Ein Fehler ist aufgetreten. Bitte aktualisieren Sie die Seite oder versuchen Sie es später erneut.";
+
+/**
+ * Other constants
+ */
+export const AD_MAX_TITLE_LENGTH = 40;
diff --git a/anzeigen-frontend/src/api/fetch-utils.ts b/anzeigen-frontend/src/api/fetch-utils.ts
index 0520e28b..fe46f9da 100644
--- a/anzeigen-frontend/src/api/fetch-utils.ts
+++ b/anzeigen-frontend/src/api/fetch-utils.ts
@@ -121,7 +121,7 @@ export function defaultCatchHandler(
  * Builds the headers for the request.
  * @returns {Headers}
  */
-function getHeaders(): Headers {
+export function getHeaders(): Headers {
   const headers = new Headers({
     "Content-Type": "application/json",
   });
@@ -136,7 +136,7 @@ function getHeaders(): Headers {
  * Returns the XSRF-TOKEN.
  * @returns {string|string}
  */
-function getXSRFToken(): string {
+export function getXSRFToken(): string {
   const help = document.cookie.match(
     "(^|;)\\s*" + "XSRF-TOKEN" + "\\s*=\\s*([^;]+)"
   );
diff --git a/anzeigen-frontend/src/api/swbrett/.openapi-generator/FILES b/anzeigen-frontend/src/api/swbrett/.openapi-generator/FILES
index ac103283..ea2b3b7b 100644
--- a/anzeigen-frontend/src/api/swbrett/.openapi-generator/FILES
+++ b/anzeigen-frontend/src/api/swbrett/.openapi-generator/FILES
@@ -1,4 +1,3 @@
-.openapi-generator-ignore
 apis/DefaultApi.ts
 apis/index.ts
 index.ts
diff --git a/anzeigen-frontend/src/api/user-client.ts b/anzeigen-frontend/src/api/user-client.ts
index aa117e0a..17172038 100644
--- a/anzeigen-frontend/src/api/user-client.ts
+++ b/anzeigen-frontend/src/api/user-client.ts
@@ -13,8 +13,8 @@ import User from "@/types/User";
  *
  * API-Definition (internal only): https://wiki.muenchen.de/betriebshandbuch/wiki/Red_Hat_Single_Sign-On_(Keycloak)#Scopes
  */
-export function getUser(): Promise<User> {
-  return fetch("api/sso/userinfo", getConfig())
+export async function getUser(): Promise<User> {
+  return await fetch("api/sso/userinfo", getConfig())
     .catch(defaultCatchHandler)
     .then((response) => {
       defaultResponseHandler(
diff --git a/anzeigen-frontend/src/components/Ad/Edit/AdAgbAccept.vue b/anzeigen-frontend/src/components/Ad/Edit/AdAgbAccept.vue
index 6368cef7..52e92028 100644
--- a/anzeigen-frontend/src/components/Ad/Edit/AdAgbAccept.vue
+++ b/anzeigen-frontend/src/components/Ad/Edit/AdAgbAccept.vue
@@ -2,21 +2,62 @@
   <v-checkbox
     v-model="isChecked"
     color="accent"
+    :disabled="disabled"
   >
     <template #label>
       <p>
-        Ich bin mit den <a>Nutzungsbedingungen (AGB)</a> einverstanden. Das
+        Ich bin mit den
+        <a :href="agbFile">Nutzungsbedingungen (AGB)</a> einverstanden. Das
         Schwarze Brett darf nur zu rein privaten Zwecken genutzt werden.
         Insbesondere Werbung kommerzieller Art ist nicht gestattet!
         Informationen zur Verarbeitung personenbezogener Daten enthalten die
-        <a>Datenschutzhinweise</a>.
+        <a :href="securityFile">Datenschutzhinweise</a>.
       </p>
     </template>
   </v-checkbox>
 </template>
 
 <script setup lang="ts">
-const isChecked = defineModel<boolean>();
-</script>
+import { useObjectUrl } from "@vueuse/core";
+import { onMounted, ref } from "vue";
+
+import AGB from "@/static/AGB-1.pdf";
+import SecInfo from "@/static/Datenschutzhinweise.pdf";
+
+/**
+ * Value if checkbox is checked
+ */
+const isChecked = defineModel<boolean>({ default: false });
+
+/**
+ * Disables the checkbox input
+ */
+defineProps<{
+  disabled?: boolean;
+}>();
 
-<style scoped></style>
+/**
+ * Blob and objectUrl for AGB
+ */
+const agbBlob = ref();
+const agbFile = useObjectUrl(agbBlob);
+
+/**
+ * Blob and objectUrl for Datenschutzhinweise
+ */
+const securityBlob = ref();
+const securityFile = useObjectUrl(securityBlob);
+
+/**
+ * Load files on mount
+ */
+onMounted(async () => {
+  const [agbResponse, secResponse] = await Promise.all([
+    fetch(AGB),
+    fetch(SecInfo),
+  ]);
+
+  agbBlob.value = await agbResponse.blob();
+  securityBlob.value = await secResponse.blob();
+});
+</script>
diff --git a/anzeigen-frontend/src/components/Ad/Edit/AdDialog.vue b/anzeigen-frontend/src/components/Ad/Edit/AdDialog.vue
index b36d4b2b..1048b665 100644
--- a/anzeigen-frontend/src/components/Ad/Edit/AdDialog.vue
+++ b/anzeigen-frontend/src/components/Ad/Edit/AdDialog.vue
@@ -2,13 +2,14 @@
   <v-dialog
     v-model="dialog"
     persistent
-    max-width="1400px"
+    max-width="900px"
   >
     <v-card>
       <v-card-title>
         <v-container class="mx-0 ad-max-width">
           <v-row>
-            <p>Anzeige erstellen oder bearbeiten</p>
+            <p v-if="isAdCreate">Anzeige erstellen</p>
+            <p v-else>Anzeige bearbeiten</p>
             <v-spacer />
             <v-btn
               prepend-icon="mdi-window-close"
@@ -20,17 +21,41 @@
         </v-container>
       </v-card-title>
       <v-card-text>
-        <ad-edit-stepper />
+        <v-form v-model="form">
+          <ad-display-card>
+            <template #subtitle> Allgemeine Informationen </template>
+            <template #text>
+              <common-ad-information :disabled="disabledInputs" />
+            </template>
+          </ad-display-card>
+          <v-divider />
+          <ad-display-card>
+            <template #subtitle> Optionale Informationen </template>
+            <template #text>
+              <optional-ad-information :disabled="disabledInputs" />
+            </template>
+          </ad-display-card>
+          <v-divider />
+          <ad-display-card>
+            <template #subtitle> Verkäufer Informationen </template>
+            <template #text>
+              <seller-ad-information :disabled="disabledInputs" />
+            </template>
+          </ad-display-card>
+        </v-form>
       </v-card-text>
-      <v-card-actions>
+      <v-card-actions class="px-4">
         <v-btn
           variant="elevated"
           color="accent"
           prepend-icon="mdi-content-save-outline"
+          @click="createAd"
         >
-          Erstellen / Speichern
+          <p v-if="isAdCreate">Erstellen</p>
+          <p v-else>Speichern</p>
         </v-btn>
         <v-btn
+          v-if="!isAdCreate"
           variant="elevated"
           color="error"
           prepend-icon="mdi-trash-can-outline"
@@ -43,19 +68,114 @@
 </template>
 
 <script setup lang="ts">
+import type {
+  AdCategory,
+  AdTO,
+  SwbFileTO,
+  SwbImageTO,
+  SwbUserTO,
+} from "@/api/swbrett";
+
 import { useEventBus } from "@vueuse/core";
-import { ref } from "vue";
+import { computed, ref } from "vue";
 
-import AdEditStepper from "@/components/Ad/Edit/AdEditStepper.vue";
+import CommonAdInformation from "@/components/Ad/Edit/CommonAdInformation.vue";
+import OptionalAdInformation from "@/components/Ad/Edit/OptionalAdInformation.vue";
+import SellerAdInformation from "@/components/Ad/Edit/SellerAdInformation.vue";
+import AdDisplayCard from "@/components/common/AdDisplayCard.vue";
+import {
+  useCreateAd,
+  useDeleteAd,
+  useUpdateAd,
+} from "@/composables/api/useAdApi";
+import { useCreateUser } from "@/composables/api/useUserApi";
 import { EV_EDIT_AD_DIALOG } from "@/Constants";
 
-const dialog = ref(false);
+const {
+  data: updateAdData,
+  call: updateAdCall,
+  loading: updateAdLoading,
+  error: updateAdError,
+} = useUpdateAd();
+const {
+  call: deleteAdCall,
+  loading: deleteAdLoading,
+  error: deleteAdError,
+} = useDeleteAd();
+const {
+  data: createAdData,
+  call: createAdCall,
+  loading: createAdLoading,
+  error: createAdError,
+} = useCreateAd();
+
+const { data, call, loading, error } = useCreateUser();
+
+const dialog = ref<boolean>(false);
+
+const adTo = ref<AdTO>();
+
+const disabledInputs = ref<boolean>(false);
 
-const dialogBus = useEventBus<boolean>(EV_EDIT_AD_DIALOG);
+const dialogBus = useEventBus<AdTO>(EV_EDIT_AD_DIALOG);
 
-dialogBus.on((event: boolean) => (dialog.value = event));
+const form = ref<boolean>();
+
+dialogBus.on((event: AdTO) => {
+  dialog.value = true;
+  adTo.value = event;
+});
+
+const exampleAd: AdTO = {
+  id: 1,
+  swbUser: {
+    id: 123,
+    name: "John Doe",
+    email: "johndoe@example.com",
+  } as SwbUserTO,
+  adCategory: {
+    id: 10,
+    name: "Electronics",
+  } as AdCategory,
+  adType: "SEEK", // Beispielwert aus AdTOAdTypeEnum
+  active: true,
+  title: "Smartphone for Sale",
+  description: "A lightly used smartphone in excellent condition.",
+  price: 250,
+  phone: "+123456789",
+  email: "seller@example.com",
+  link: "https://example.com/listing/1",
+  creationDateTime: new Date("2024-01-01T12:00:00Z"),
+  expiryDate: new Date("2024-12-31T23:59:59Z"),
+  imagePreviewBase64: "data:image/png;base64,iVBORw0KGgoAAAANS...",
+  adImg: {
+    id: 101,
+    fileName: "smartphone.png",
+    url: "https://example.com/images/smartphone.png",
+  } as SwbImageTO,
+  adFiles: [
+    {
+      id: 201,
+      fileName: "manual.pdf",
+      url: "https://example.com/files/manual.pdf",
+    } as SwbFileTO,
+  ],
+  views: 150,
+};
+
+const createAd = () => {
+  call({
+    swbUserTO: {
+      displayName: "user",
+      id: 4,
+      lhmObjectId: "idontknow",
+    },
+  });
+};
 
 const close = () => (dialog.value = false);
+
+const isAdCreate = computed(() => adTo.value === undefined);
 </script>
 
 <style scoped></style>
diff --git a/anzeigen-frontend/src/components/Ad/Edit/AdEditStepper.vue b/anzeigen-frontend/src/components/Ad/Edit/AdEditStepper.vue
index 90ab8869..0edb4820 100644
--- a/anzeigen-frontend/src/components/Ad/Edit/AdEditStepper.vue
+++ b/anzeigen-frontend/src/components/Ad/Edit/AdEditStepper.vue
@@ -19,22 +19,7 @@
       <v-stepper-window>
         <v-form>
           <v-stepper-window-item value="1">
-            <v-text-field label="Titel" />
-            <v-select />
-            <v-radio-group inline>
-              <v-radio label="Biete" />
-              <v-radio label="Suche" />
-            </v-radio-group>
-            <v-textarea label="Beschreibung" />
-            <v-number-input
-              label="Preis"
-              control-variant="split"
-            />
-            <v-radio-group inline>
-              <v-radio label="VHB" />
-              <v-radio label="Festpreis" />
-              <v-radio label="zu verschenken" />
-            </v-radio-group>
+            <common-ad-information />
           </v-stepper-window-item>
           <v-stepper-window-item value="2">
             <v-file-input label="Foto auswählen" />
@@ -74,9 +59,10 @@
 </template>
 
 <script setup lang="ts">
-import { VDateInput, VNumberInput } from "vuetify/labs/components";
+import { VDateInput } from "vuetify/labs/components";
 
 import AdAgbAccept from "@/components/Ad/Edit/AdAgbAccept.vue";
+import CommonAdInformation from "@/components/Ad/Edit/CommonAdInformation.vue";
 </script>
 
 <style scoped></style>
diff --git a/anzeigen-frontend/src/components/Ad/Edit/CommonAdInformation.vue b/anzeigen-frontend/src/components/Ad/Edit/CommonAdInformation.vue
new file mode 100644
index 00000000..0a6e893c
--- /dev/null
+++ b/anzeigen-frontend/src/components/Ad/Edit/CommonAdInformation.vue
@@ -0,0 +1,130 @@
+<template>
+  <v-text-field
+    v-model="title"
+    label="Titel"
+    class="w-md-66 w-sm-75"
+    :disabled="disabled"
+    :rules="[
+      (value) => !!value || 'Bitte geben Sie einen Titel ein.',
+      (value) =>
+        value.length < AD_MAX_TITLE_LENGTH || 'Bitte kürzen Sie den Titel',
+    ]"
+  />
+  <v-select
+    v-model="category"
+    class="w-md-66 w-sm-75"
+    placeholder="Kategorie"
+    :loading="categoryLoading"
+    :disabled="disabled"
+    :items="data"
+    item-title="name"
+    :rules="[(value) => !!value || 'Bitte wählen Sie eine Kategorie aus.']"
+  />
+  <v-radio-group
+    v-model="adType"
+    :disabled="disabled"
+    inline
+  >
+    <v-radio
+      label="Biete"
+      value="OFFER"
+    />
+    <v-radio
+      label="Suche"
+      value="SEEK"
+    />
+  </v-radio-group>
+  <v-textarea
+    v-model="description"
+    label="Beschreibung"
+    max-rows="3"
+    :disabled="disabled"
+    :rules="[
+      (value) =>
+        !!value ||
+        'Bitte geben Sie eine Beschreibung mit maximal 1000 Zeichen ein.',
+    ]"
+  />
+  <v-number-input
+    label="Preis"
+    class="w-md-66 w-sm-75"
+    :min="0"
+    :disabled="priceOption === 0 || disabled"
+    :model-value="displayedPrice"
+    @update:model-value="updatedPrice"
+  >
+    <template #append-inner>
+      <v-icon
+        class="mr-2"
+        icon="mdi-currency-eur"
+      />
+    </template>
+  </v-number-input>
+  <v-radio-group
+    v-model="priceOption"
+    :disabled="disabled"
+    inline
+  >
+    <v-radio
+      label="Festpreis"
+      :value="1"
+    />
+    <v-radio
+      label="VB"
+      :value="-1"
+    />
+    <v-radio
+      label="Zu verschenken"
+      :value="0"
+    />
+  </v-radio-group>
+</template>
+
+<script setup lang="ts">
+import type { AdCategory, AdTOAdTypeEnum } from "@/api/swbrett";
+
+import { computed, onMounted, ref, watch } from "vue";
+import { VNumberInput } from "vuetify/labs/components";
+
+import { useGetCategories } from "@/composables/api/useGetCategories";
+import { AD_MAX_TITLE_LENGTH } from "@/Constants";
+
+const {
+  call: getCategories,
+  data,
+  loading: categoryLoading,
+} = useGetCategories();
+
+const title = defineModel<string>("title", { default: "" });
+
+const category = defineModel<AdCategory>("category");
+
+const adType = defineModel<AdTOAdTypeEnum>("adType", {
+  default: "OFFER",
+});
+
+const description = defineModel<string>("description", { default: "" });
+
+const price = defineModel<number>("price", { default: 1 });
+
+defineProps<{
+  disabled?: boolean;
+}>();
+
+const priceOption = ref<number>(Math.sign(price.value ?? 1));
+
+onMounted(() => {
+  getCategories();
+});
+
+watch(priceOption, (newPriceOption) => {
+  price.value = (newPriceOption ?? 1) * Math.abs(price.value ?? 1);
+});
+
+const displayedPrice = computed(() => Math.abs(price.value ?? 0));
+
+const updatedPrice = (newPrice: number) =>
+  (price.value = newPrice * priceOption.value);
+</script>
+
+<style scoped></style>
diff --git a/anzeigen-frontend/src/components/Ad/Edit/OptionalAdInformation.vue b/anzeigen-frontend/src/components/Ad/Edit/OptionalAdInformation.vue
new file mode 100644
index 00000000..f0c8959e
--- /dev/null
+++ b/anzeigen-frontend/src/components/Ad/Edit/OptionalAdInformation.vue
@@ -0,0 +1,47 @@
+<template>
+  <v-file-input
+    v-model="pictureInternal"
+    prepend-icon="mdi-camera"
+    label="Foto auswählen"
+    class="w-md-66 w-sm-75"
+    :disabled="disabled"
+  />
+  <v-file-input
+    v-model="additionalFileInternal"
+    label="Optionale Anhänge"
+    class="w-md-66 w-sm-75"
+    multiple
+    show-size
+    :disabled="disabled"
+  />
+  <v-text-field
+    v-model="link"
+    prepend-icon="mdi-link"
+    label="Link (optional)"
+    class="w-md-66 w-sm-75"
+    type="url"
+    :disabled="disabled"
+    :rules="[ruleLink]"
+  />
+</template>
+
+<script setup lang="ts">
+import { ref } from "vue";
+
+defineProps<{
+  disabled?: boolean;
+}>();
+
+const link = defineModel<string>("link");
+
+const pictureInternal = ref<File>();
+
+const additionalFileInternal = ref<File[]>();
+
+const ruleLink = (value: string) =>
+  /^https:\/\/(www\.)?[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&/=]*)$/.test(
+    value
+  ) || "Bitte geben Sie einen validen Link an.";
+</script>
+
+<style scoped></style>
diff --git a/anzeigen-frontend/src/components/Ad/Edit/SellerAdInformation.vue b/anzeigen-frontend/src/components/Ad/Edit/SellerAdInformation.vue
new file mode 100644
index 00000000..11d74d77
--- /dev/null
+++ b/anzeigen-frontend/src/components/Ad/Edit/SellerAdInformation.vue
@@ -0,0 +1,91 @@
+<template>
+  <v-date-input
+    v-model="expiryDate"
+    class="w-md-66 w-sm-75"
+    label="Ablaufdatum"
+    :min="yesterdayDate"
+    :disabled="disabled"
+  />
+  <v-text-field
+    ref="refPhoneNumber"
+    v-model="phoneNumber"
+    prepend-icon="mdi-phone-outline"
+    class="w-md-66 w-sm-75"
+    label="Telefonnummer"
+    :rules="[minOneContactRule, rulePhoneNumber]"
+    :disabled="disabled"
+  />
+  <v-text-field
+    ref="refEmail"
+    v-model="email"
+    prepend-icon="mdi-email-outline"
+    class="w-md-66 w-sm-75"
+    label="E-Mail Adresse"
+    type="email"
+    :rules="[minOneContactRule, ruleEmail]"
+    :disabled="disabled"
+  />
+  <ad-agb-accept :disabled="disabled" />
+</template>
+
+<script setup lang="ts">
+import { computed, useTemplateRef, watch } from "vue";
+import { VDateInput } from "vuetify/labs/components";
+
+import AdAgbAccept from "@/components/Ad/Edit/AdAgbAccept.vue";
+
+const expiryDate = defineModel<Date>("expiryDate");
+
+const phoneNumber = defineModel<string>("phone", { default: "" });
+
+const email = defineModel<string>("email", { default: "" });
+
+defineProps<{
+  disabled?: boolean;
+}>();
+
+const refPhone = useTemplateRef("refPhoneNumber");
+const refEmail = useTemplateRef("refEmail");
+
+/**
+ * Watches the input for phone number / email and triggers the validation again.
+ * This needs to be done, otherwise one input can retain its error state
+ */
+watch([phoneNumber, email], () => {
+  refPhone.value?.validate();
+  refEmail.value?.validate();
+});
+
+/**
+ * Returns date object for yesterday (today - 1)
+ */
+const yesterdayDate = computed(() => {
+  const todayDate = new Date();
+  todayDate.setDate(todayDate.getDate() - 1);
+  return todayDate;
+});
+
+/**
+ * Validation rule for email - do not ask me why it is so complicated
+ * @param value the current input
+ */
+const ruleEmail = (value: string) =>
+  /^(([^<>()[\].,;:\s@"]+(\.[^<>()[\].,;:\s@"]+)*)|(".+"))@(([^<>()[\].,;:\s@"]+\.)+[^<>()[\].,;:\s@"]{2,})$/.test(
+    value
+  ) || "Die E-Mail Adresse ist nicht valide";
+
+/**
+ * Validation rule for phone number - includes the '+' at the start
+ * @param value the current input
+ */
+const rulePhoneNumber = (value: string) =>
+  /^\+?\d*$/.test(value) || "Die Telefonnummer ist ungültig";
+
+/**
+ * Minimum one contact needs to be set - this can be email or phone number
+ */
+const minOneContactRule = () =>
+  !!email.value ||
+  !!phoneNumber.value ||
+  "Bitte geben Sie eine Telefonnummer und/oder (private) E-Mail-Adresse an.";
+</script>
diff --git a/anzeigen-frontend/src/components/AdNavBar.vue b/anzeigen-frontend/src/components/AdNavBar.vue
index 0e626293..bcfd79ea 100644
--- a/anzeigen-frontend/src/components/AdNavBar.vue
+++ b/anzeigen-frontend/src/components/AdNavBar.vue
@@ -1,5 +1,5 @@
 <template>
-  <account-card />
+  <account-card :loading="loading" />
   <ad-edit-button
     class="w-100 mb-4"
     size="large"
@@ -15,20 +15,98 @@
 </template>
 
 <script setup lang="ts">
+import type { AdTO } from "@/api/swbrett";
+
 import { useEventBus } from "@vueuse/core";
+import { computed, onMounted } from "vue";
 
+import { Levels } from "@/api/error";
 import AdEditButton from "@/components/Ad/AdEditButton.vue";
 import AccountCard from "@/components/common/AccountCard.vue";
 import AdDisplaySheet from "@/components/common/AdDisplaySheet.vue";
 import FilterAdCategory from "@/components/Filter/FilterAdCategory.vue";
 import FilterAdType from "@/components/Filter/FilterAdType.vue";
 import SortAdSelection from "@/components/Filter/SortAdSelection.vue";
-import { EV_EDIT_AD_DIALOG } from "@/Constants";
+import {
+  useCreateUser,
+  useFindUser,
+  useUserInfo,
+} from "@/composables/api/useUserApi";
+import { useSnackbar } from "@/composables/useSnackbar";
+import { API_ERROR_MSG, EV_EDIT_AD_DIALOG } from "@/Constants";
+import { useUserStore } from "@/stores/user";
+
+const dialogBus = useEventBus<AdTO>(EV_EDIT_AD_DIALOG);
+const userStore = useUserStore();
+const snackbar = useSnackbar();
+
+const {
+  call: userInfoCall,
+  data: userInfoData,
+  error: userInfoError,
+  loading: userInfoLoading,
+} = useUserInfo();
+
+const {
+  call: findUserCall,
+  data: findUserData,
+  loading: findUserLoading,
+} = useFindUser();
 
-const dialogBus = useEventBus<boolean>(EV_EDIT_AD_DIALOG);
+const {
+  call: createUserCall,
+  data: createUserData,
+  loading: createUserLoading,
+} = useCreateUser();
 
 const triggerDialog = () => {
-  dialogBus.emit(true);
+  dialogBus.emit(undefined);
+};
+
+onMounted(async () => {
+  await loadUser();
+});
+
+const loading = computed(
+  () =>
+    userInfoLoading.value || findUserLoading.value || createUserLoading.value
+);
+
+const currentUser = computed(() => findUserData.value || createUserData.value);
+
+const loadUser = async () => {
+  // userinfo call
+  await userInfoCall();
+  if (userInfoError.value) {
+    snackbar.sendMessage({
+      level: Levels.ERROR,
+      message: API_ERROR_MSG,
+    });
+    return;
+  }
+
+  // save into store
+  userStore.setUser(JSON.parse(JSON.stringify(userInfoData.value)));
+
+  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+  await findUserCall({ body: userStore.lhmObjectId! });
+
+  if (findUserData.value?.id === undefined) {
+    // no user was found - therefore create a new one
+    await createUserCall({
+      swbUserTO: {
+        displayName: userStore.getUser?.displayName,
+        lhmObjectId: userStore.lhmObjectId,
+      },
+    });
+  }
+
+  snackbar.sendMessage({
+    level: findUserData.value?.id ? Levels.INFO : Levels.SUCCESS,
+    message: `Willkommen ${findUserData.value?.id ? "" : "zurück"} ${currentUser.value?.displayName}.`,
+  });
+
+  userStore.setUserId(currentUser.value?.id || -1);
 };
 </script>
 
diff --git a/anzeigen-frontend/src/components/Filter/FilterAdCategory.vue b/anzeigen-frontend/src/components/Filter/FilterAdCategory.vue
index 1001934d..08741383 100644
--- a/anzeigen-frontend/src/components/Filter/FilterAdCategory.vue
+++ b/anzeigen-frontend/src/components/Filter/FilterAdCategory.vue
@@ -24,7 +24,7 @@
             {{ NO_CATEGORY.name }}
           </v-tab>
           <v-tab
-            v-for="category in data"
+            v-for="category in categoriesStore.categories"
             :key="category.id"
             :value="category"
           >
@@ -53,19 +53,21 @@ import AdDisplayCard from "@/components/common/AdDisplayCard.vue";
 import { useGetCategories } from "@/composables/api/useGetCategories";
 import { useSnackbar } from "@/composables/useSnackbar";
 import { API_ERROR_MSG } from "@/Constants";
-
-const snackbar = useSnackbar();
+import { useCategoriesStore } from "@/stores/adcategory";
 
 const NO_CATEGORY = { id: -1, name: "Alle", standard: true };
 
 const { call: getCategories, data, loading, error } = useGetCategories();
 
+const snackbar = useSnackbar();
+
 const categoryQuery = useRouteQuery("categoryId");
 
 const selectedCategory = ref<AdCategory>(NO_CATEGORY);
 
+const categoriesStore = useCategoriesStore();
+
 onMounted(async () => {
-  // initial api-call
   await getCategories();
 
   // error catching
@@ -76,11 +78,13 @@ onMounted(async () => {
     });
   }
 
+  categoriesStore.setCategories(data.value as AdCategory[]);
+
   // initial selection
-  if (categoryQuery.value && data.value !== undefined) {
+  if (categoryQuery.value && categoriesStore.categories.length !== 0) {
     // search for matching category and set it
     selectedCategory.value =
-      data.value.find(
+      categoriesStore.categories.find(
         (category) =>
           category.id && category.id.toString() === categoryQuery.value
       ) || selectedCategory.value;
diff --git a/anzeigen-frontend/src/components/common/AccountCard.vue b/anzeigen-frontend/src/components/common/AccountCard.vue
index 914e5d30..d9f34cd8 100644
--- a/anzeigen-frontend/src/components/common/AccountCard.vue
+++ b/anzeigen-frontend/src/components/common/AccountCard.vue
@@ -2,7 +2,9 @@
   <v-card
     flat
     class="mb-4"
-    title="Vorname Nachname"
+    :title="userStore.getUser?.displayName"
+    :loading="loading"
+    :disabled="loading"
     subtitle="Hier gehts zu Ihren Anzeigen"
     link
   >
@@ -13,34 +15,14 @@
 </template>
 
 <script setup lang="ts">
-import { onMounted } from "vue";
-
-import { getUser } from "@/api/user-client";
 import Ad2ImageAvatar from "@/components/common/Ad2ImageAvatar.vue";
 import { useUserStore } from "@/stores/user";
-import User, { UserLocalDevelopment } from "@/types/User";
 
 const userStore = useUserStore();
 
-onMounted(() => {
-  loadUser();
-});
-
-/**
- * Loads UserInfo from the backend and sets it in the store.
- */
-function loadUser(): void {
-  getUser()
-    .then((user: User) => userStore.setUser(user))
-    .catch(() => {
-      // No user info received, so fallback
-      if (import.meta.env.DEV) {
-        userStore.setUser(UserLocalDevelopment());
-      } else {
-        userStore.setUser(null);
-      }
-    });
-}
+const { loading = false } = defineProps<{
+  loading?: boolean;
+}>();
 </script>
 
 <style scoped></style>
diff --git a/anzeigen-frontend/src/components/common/AdDisplayCard.vue b/anzeigen-frontend/src/components/common/AdDisplayCard.vue
index c793cd96..55683ab5 100644
--- a/anzeigen-frontend/src/components/common/AdDisplayCard.vue
+++ b/anzeigen-frontend/src/components/common/AdDisplayCard.vue
@@ -3,6 +3,9 @@
     <v-card-title>
       <slot name="title" />
     </v-card-title>
+    <v-card-subtitle>
+      <slot name="subtitle" />
+    </v-card-subtitle>
     <v-card-text>
       <slot name="text" />
     </v-card-text>
diff --git a/anzeigen-frontend/src/composables/api/useAdApi.ts b/anzeigen-frontend/src/composables/api/useAdApi.ts
new file mode 100644
index 00000000..c49e3086
--- /dev/null
+++ b/anzeigen-frontend/src/composables/api/useAdApi.ts
@@ -0,0 +1,39 @@
+import type {
+  AdTO,
+  CreateAdRequest,
+  DeleteAdRequest,
+  UpdateAdRequest,
+} from "@/api/swbrett";
+
+import { inject } from "vue";
+
+import { useApiCall } from "@/composables/api/useApiCall";
+import { DEFAULT_API_KEY } from "@/composables/useApi";
+
+export const useUpdateAd = () => {
+  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+  const api = inject(DEFAULT_API_KEY)!;
+
+  return useApiCall<UpdateAdRequest, AdTO>((params: UpdateAdRequest) =>
+    api.updateAd(params)
+  );
+};
+
+export const useDeleteAd = () => {
+  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+  const api = inject(DEFAULT_API_KEY)!;
+
+  // eslint-disable-next-line @typescript-eslint/no-invalid-void-type
+  return useApiCall<DeleteAdRequest, void>((params: DeleteAdRequest) =>
+    api.deleteAd(params)
+  );
+};
+
+export function useCreateAd() {
+  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+  const api = inject(DEFAULT_API_KEY)!;
+
+  return useApiCall<CreateAdRequest, AdTO>((params: CreateAdRequest) =>
+    api.createAd(params)
+  );
+}
diff --git a/anzeigen-frontend/src/composables/api/useApiCall.ts b/anzeigen-frontend/src/composables/api/useApiCall.ts
new file mode 100644
index 00000000..a9b4ae81
--- /dev/null
+++ b/anzeigen-frontend/src/composables/api/useApiCall.ts
@@ -0,0 +1,30 @@
+import { readonly, ref } from "vue";
+
+export function useApiCall<TRequest, TResponse = void>(
+  apiMethod: (params: TRequest) => Promise<TResponse>
+) {
+  const loadingInternal = ref(false);
+  const errorInternal = ref(false);
+  const dataInternal = ref<TResponse | null>(null);
+
+  const loading = readonly(loadingInternal);
+  const error = readonly(errorInternal);
+  const data = readonly(dataInternal);
+
+  const call = (params: TRequest): Promise<TResponse | boolean> => {
+    loadingInternal.value = true;
+    errorInternal.value = false;
+
+    return apiMethod(params)
+      .then((data) => (dataInternal.value = data))
+      .catch(() => (errorInternal.value = true))
+      .finally(() => (loadingInternal.value = false));
+  };
+
+  return {
+    loading,
+    error,
+    data,
+    call,
+  };
+}
diff --git a/anzeigen-frontend/src/composables/api/useGetCategories.ts b/anzeigen-frontend/src/composables/api/useGetCategories.ts
index b20e2620..343436f8 100644
--- a/anzeigen-frontend/src/composables/api/useGetCategories.ts
+++ b/anzeigen-frontend/src/composables/api/useGetCategories.ts
@@ -1,42 +1,14 @@
 import type { AdCategory } from "@/api/swbrett";
 
-import { inject, readonly, ref } from "vue";
+import { inject } from "vue";
 
+import { useApiCall } from "@/composables/api/useApiCall";
 import { DEFAULT_API_KEY } from "@/composables/useApi";
 
-export function useGetCategories() {
+export const useGetCategories = () => {
   // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
   const api = inject(DEFAULT_API_KEY)!;
 
-  const loadingInternal = ref(false);
-  const errorInternal = ref(false);
-  const dataInternal = ref<AdCategory[]>();
-
-  const loading = readonly(loadingInternal);
-  const error = readonly(errorInternal);
-  const data = readonly(dataInternal);
-
-  const call = () => {
-    loadingInternal.value = true;
-    errorInternal.value = false;
-
-    return api
-      .getAllAdCategories()
-      .then((data) => {
-        dataInternal.value = data;
-      })
-      .catch(() => {
-        errorInternal.value = true;
-      })
-      .finally(() => {
-        loadingInternal.value = false;
-      });
-  };
-
-  return {
-    loading,
-    error,
-    data,
-    call,
-  };
-}
+  // eslint-disable-next-line @typescript-eslint/no-invalid-void-type
+  return useApiCall<void, AdCategory[]>(() => api.getAllAdCategories());
+};
diff --git a/anzeigen-frontend/src/composables/api/useUserApi.ts b/anzeigen-frontend/src/composables/api/useUserApi.ts
new file mode 100644
index 00000000..fe99f812
--- /dev/null
+++ b/anzeigen-frontend/src/composables/api/useUserApi.ts
@@ -0,0 +1,35 @@
+import type {
+  CreateUserRequest,
+  FindUserRequest,
+  SwbUserTO,
+} from "@/api/swbrett";
+import type User from "@/types/User";
+
+import { inject } from "vue";
+
+import { getUser } from "@/api/user-client";
+import { useApiCall } from "@/composables/api/useApiCall";
+import { DEFAULT_API_KEY } from "@/composables/useApi";
+
+export const useCreateUser = () => {
+  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+  const api = inject(DEFAULT_API_KEY)!;
+
+  return useApiCall<CreateUserRequest, SwbUserTO>((params: CreateUserRequest) =>
+    api.createUser(params)
+  );
+};
+
+export const useFindUser = () => {
+  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+  const api = inject(DEFAULT_API_KEY)!;
+
+  return useApiCall<FindUserRequest, SwbUserTO>((params: FindUserRequest) =>
+    api.findUser(params)
+  );
+};
+
+export const useUserInfo = () => {
+  // eslint-disable-next-line @typescript-eslint/no-invalid-void-type
+  return useApiCall<void, User>(() => getUser());
+};
diff --git a/anzeigen-frontend/src/composables/useApi.ts b/anzeigen-frontend/src/composables/useApi.ts
index 709af8ed..7044771a 100644
--- a/anzeigen-frontend/src/composables/useApi.ts
+++ b/anzeigen-frontend/src/composables/useApi.ts
@@ -1,15 +1,37 @@
+import type { HTTPHeaders } from "@/api/swbrett";
 import type { InjectionKey } from "vue";
 
 import { provide } from "vue";
 
+import { getHeaders } from "@/api/fetch-utils";
 import { Configuration, DefaultApi } from "@/api/swbrett";
 
 export const DEFAULT_API_KEY: InjectionKey<DefaultApi> = Symbol("defaultApi");
 
+/**
+ * Initialisiert und konfiguriert die API mit Standard-Einstellungen.
+ */
 export const useApi = () => {
   const config = new Configuration({
     basePath: "/api/backend-service",
+    credentials: "same-origin",
+    headers: convertHeaders(getHeaders()),
   });
   const defaultApi = new DefaultApi(config);
   provide(DEFAULT_API_KEY, defaultApi);
 };
+
+/**
+ * Konvertiert ein Headers-Objekt in ein einfaches Schlüssel-Wert-Paar-Objekt.
+ * @param {Headers} headers - Das zu konvertierende Headers-Objekt.
+ * @returns {HTTPHeaders} Ein Objekt mit den gleichen Headern.
+ */
+function convertHeaders(headers: Headers): HTTPHeaders {
+  const httpHeaders: HTTPHeaders = {};
+
+  headers.forEach((value, key) => {
+    httpHeaders[key] = value;
+  });
+
+  return httpHeaders;
+}
diff --git a/anzeigen-frontend/src/static/AGB-1.pdf b/anzeigen-frontend/src/static/AGB-1.pdf
new file mode 100644
index 00000000..aa575b98
Binary files /dev/null and b/anzeigen-frontend/src/static/AGB-1.pdf differ
diff --git a/anzeigen-frontend/src/static/Datenschutzhinweise.pdf b/anzeigen-frontend/src/static/Datenschutzhinweise.pdf
new file mode 100644
index 00000000..d4e27d30
Binary files /dev/null and b/anzeigen-frontend/src/static/Datenschutzhinweise.pdf differ
diff --git a/anzeigen-frontend/src/stores/adcategory.ts b/anzeigen-frontend/src/stores/adcategory.ts
new file mode 100644
index 00000000..0e7a45ef
--- /dev/null
+++ b/anzeigen-frontend/src/stores/adcategory.ts
@@ -0,0 +1,14 @@
+import type { AdCategory } from "@/api/swbrett";
+
+import { defineStore } from "pinia";
+import { ref } from "vue";
+
+export const useCategoriesStore = defineStore("category", () => {
+  const categories = ref<AdCategory[]>([]);
+
+  const setCategories = (payload: AdCategory[]) => {
+    categories.value = payload;
+  };
+
+  return { categories, setCategories };
+});
diff --git a/anzeigen-frontend/src/stores/user.ts b/anzeigen-frontend/src/stores/user.ts
index 1bad4a8c..7f464393 100644
--- a/anzeigen-frontend/src/stores/user.ts
+++ b/anzeigen-frontend/src/stores/user.ts
@@ -1,3 +1,5 @@
+import type { SwbUserTO } from "@/api/swbrett";
+
 import { defineStore } from "pinia";
 import { computed, ref } from "vue";
 
@@ -9,13 +11,28 @@ export interface UserState {
 
 export const useUserStore = defineStore("user", () => {
   const user = ref<User | null>(null);
+  const userID = ref<number | null>();
 
   const getUser = computed((): User | null => {
     return user.value;
   });
 
+  const swbUserTo = computed(() => {
+    return {
+      lhmObjectId: user.value?.lhmObjectID,
+      displayName: user.value?.displayName,
+    } as SwbUserTO;
+  });
+
+  const lhmObjectId = computed(() => user.value?.lhmObjectID);
+
   function setUser(payload: User | null): void {
     user.value = payload;
   }
-  return { getUser, setUser };
+
+  function setUserId(payload: number) {
+    userID.value = payload;
+  }
+
+  return { getUser, setUser, swbUserTo, lhmObjectId, setUserId };
 });
diff --git a/api-spec/anzeigen_portal-openapi.yaml b/api-spec/anzeigen_portal-openapi.yaml
index 82bd6c5c..66f9ac7b 100644
--- a/api-spec/anzeigen_portal-openapi.yaml
+++ b/api-spec/anzeigen_portal-openapi.yaml
@@ -697,3 +697,14 @@ components:
           type: "boolean"
         fileValue:
           $ref: "#/components/schemas/SwbFileTO"
+  securitySchemes:
+    spring_oauth:
+      type: oauth2
+      description: Oauth2 flow
+      flows:
+        password:
+          authorizationUrl: http://keycloak:8100/auth/realms/local_realm/protocol/openid-connect/auth
+          tokenUrl: http://keycloak:8100/auth/realms/local_realm/protocol/openid-connect/token
+          refreshUrl: http://keycloak:8100/auth/realms/local_realm/protocol/openid-connect/token
+          scopes:
+            lhm_extended: lhm_extended