diff --git a/frontend/src/apis/loginAPI.js b/frontend/src/apis/loginAPI.js
index 62ea680df..799ff25bc 100644
--- a/frontend/src/apis/loginAPI.js
+++ b/frontend/src/apis/loginAPI.js
@@ -78,6 +78,47 @@ const loginAPI = {
       CONFIG.LOGIN_API_URL + 'loginViaEmailVerificationCode?emailVerificationCode=' + optin,
     )
   },
+  getUserInfos: async (sessionId, email) => {
+    const payload = {
+      session_id: sessionId,
+      email: email,
+      ask: ['user.first_name', 'user.last_name'],
+    }
+    return apiPost(CONFIG.LOGIN_API_URL + 'getUserInfos', payload)
+  },
+  updateUserInfos: async (sessionId, email, firstName, lastName /*, description */) => {
+    const payload = {
+      session_id: sessionId,
+      email,
+      update: {
+        'User.first_name': firstName,
+        'User.last_name': lastName,
+        /* 'User.description': description, */
+      },
+    }
+    return apiPost(CONFIG.LOGIN_API_URL + 'updateUserInfos', payload)
+  },
+
+  //  `POST http://localhost/login_api/getUserInfos`
+  //
+  // with:
+  //
+  // ```json
+  // {
+  //	"session_id": -127182,
+  //	"email": "max.musterman@gmail.de",
+  //	"ask": [
+  //		"EmailVerificationCode.Register",
+  //		"loginServer.path",
+  //		"user.pubkeyhex",
+  //		"user.first_name",
+  //		"user.last_name",
+  //		"user.disabled",
+  //		"user.email_checked",
+  //		"user.language"
+  //  	]
+  // }
+
   changePassword: async (sessionId, email, password) => {
     const payload = {
       session_id: sessionId,
@@ -99,16 +140,6 @@ const loginAPI = {
     }
     return apiPost(CONFIG.LOGIN_API_URL + 'updateUserInfos', payload)
   },
-  changeEmailProfil: async (sessionId, email, emailNew) => {
-    const payload = {
-      session_id: sessionId,
-      email,
-      update: {
-        'User.emailNew': emailNew,
-      },
-    }
-    return apiPost(CONFIG.LOGIN_API_URL + 'updateUserInfos', payload)
-  },
   changeUsernameProfil: async (sessionId, email, usernameNew) => {
     const payload = {
       session_id: sessionId,
@@ -129,18 +160,6 @@ const loginAPI = {
     }
     return apiPost(CONFIG.LOGIN_API_URL + 'updateUserInfos', payload)
   },
-  updateUserdata: async (sessionId, email, firstName, lastName, description) => {
-    const payload = {
-      session_id: sessionId,
-      email,
-      update: {
-        'User.first_name': firstName,
-        'User.last_name': lastName,
-        'User.description': description,
-      },
-    }
-    return apiPost(CONFIG.LOGIN_API_URL + 'updateUserInfos', payload)
-  },
 }
 
 export default loginAPI
diff --git a/frontend/src/store/store.js b/frontend/src/store/store.js
index 1d89894fb..79f04da61 100644
--- a/frontend/src/store/store.js
+++ b/frontend/src/store/store.js
@@ -13,6 +13,10 @@ export const mutations = {
   sessionId: (state, sessionId) => {
     state.sessionId = sessionId
   },
+  username: (state, username) => {
+    // console.log('store username mutation', username)
+    state.username = username
+  },
 }
 
 export const actions = {
@@ -20,10 +24,12 @@ export const actions = {
     commit('sessionId', data.sessionId)
     commit('email', data.user.email)
     commit('language', data.user.language)
+    commit('username', data.user.username ? '' : 'teststoreusername')
   },
   logout: ({ commit, state }) => {
     commit('sessionId', null)
     commit('email', null)
+    commit('username', null)
     sessionStorage.clear()
   },
 }
@@ -39,6 +45,7 @@ export const store = new Vuex.Store({
     email: '',
     language: null,
     modals: false,
+    username: 'testname',
   },
   getters: {},
   // Syncronous mutation of the state
diff --git a/frontend/src/store/store.test.js b/frontend/src/store/store.test.js
index 11dd5949b..3f466f723 100644
--- a/frontend/src/store/store.test.js
+++ b/frontend/src/store/store.test.js
@@ -40,7 +40,7 @@ describe('Vuex store', () => {
           { commit, state },
           { sessionId: 1234, user: { email: 'someone@there.is', language: 'en' } },
         )
-        expect(commit).toHaveBeenCalledTimes(3)
+        expect(commit).toHaveBeenCalledTimes(4)
       })
 
       it('commits sessionId', () => {
@@ -74,7 +74,7 @@ describe('Vuex store', () => {
 
       it('calls two commits', () => {
         logout({ commit, state })
-        expect(commit).toHaveBeenCalledTimes(2)
+        expect(commit).toHaveBeenCalledTimes(3)
       })
 
       it('commits sessionId', () => {
diff --git a/frontend/src/views/Layout/DashboardLayout_gdd.vue b/frontend/src/views/Layout/DashboardLayout_gdd.vue
index 81d8b6432..2e66c11d6 100755
--- a/frontend/src/views/Layout/DashboardLayout_gdd.vue
+++ b/frontend/src/views/Layout/DashboardLayout_gdd.vue
@@ -87,8 +87,6 @@ export default {
       pending: true,
       UserProfileTestData: {
         username: 'Mustermax',
-        name: 'Max',
-        lastname: 'Mustermann',
         desc:
           'Max Mustermann seine Beschreibung. Max Mustermann seine Beschreibung. Max Mustermann seine Beschreibung. Max Mustermann seine Beschreibung. ',
       },
diff --git a/frontend/src/views/Pages/UserProfile/UserCard.vue b/frontend/src/views/Pages/UserProfile/UserCard.vue
index 1e94867e6..94c21fdaf 100755
--- a/frontend/src/views/Pages/UserProfile/UserCard.vue
+++ b/frontend/src/views/Pages/UserProfile/UserCard.vue
@@ -14,7 +14,7 @@
             <span class="description">GDD</span>
           </div>
           <div>
-            <span class="heading">{{ $n(transactionCount) }}</span>
+            <span class="heading">{{ transactionCount }}</span>
             <span class="description">{{ $t('transactions') }}</span>
           </div>
           <div>
diff --git a/frontend/src/views/Pages/UserProfile/UserCard_FormUserData.vue b/frontend/src/views/Pages/UserProfile/UserCard_FormUserData.vue
index 2e27db338..723a5cee9 100644
--- a/frontend/src/views/Pages/UserProfile/UserCard_FormUserData.vue
+++ b/frontend/src/views/Pages/UserProfile/UserCard_FormUserData.vue
@@ -25,10 +25,10 @@
             <small>{{ $t('form.firstname') }}</small>
           </b-col>
           <b-col v-if="edit_userdata" class="col-md-9 col-sm-10">
-            {{ UserProfileTestData.name }}
+            {{ userdata.first_name }}
           </b-col>
           <b-col v-else class="col-md-9 col-sm-10">
-            <b-input type="text" v-model="name"></b-input>
+            <b-input type="text" v-model="form.first_name"></b-input>
           </b-col>
         </b-row>
         <b-row class="mb-3">
@@ -36,10 +36,10 @@
             <small>{{ $t('form.lastname') }}</small>
           </b-col>
           <b-col v-if="edit_userdata" class="col-md-9 col-sm-10">
-            {{ UserProfileTestData.lastname }}
+            {{ userdata.last_name }}
           </b-col>
           <b-col v-else class="col-md-9 col-sm-10">
-            <b-input type="text" v-model="lastname"></b-input>
+            <b-input type="text" v-model="form.last_name"></b-input>
           </b-col>
         </b-row>
         <b-row class="mb-3">
@@ -50,12 +50,7 @@
             {{ UserProfileTestData.desc }}
           </b-col>
           <b-col v-else class="col-md-9 col-sm-10">
-            <b-textarea
-              rows="3"
-              max-rows="6"
-              placeholder="UserProfileTestData.dec"
-              v-model="dec"
-            ></b-textarea>
+            <b-textarea rows="3" max-rows="6" v-model="form.desc"></b-textarea>
           </b-col>
         </b-row>
       </div>
@@ -63,39 +58,37 @@
   </b-card>
 </template>
 <script>
-import loginAPI from '../../../apis/loginAPI'
-
 export default {
   name: 'FormUserData',
-
+  props: {
+    userdata: { type: Object },
+    UserProfileTestData: { type: Object },
+  },
   data() {
     return {
       edit_userdata: true,
       sessionId: null,
       email: null,
-      name: this.UserProfileTestData.name,
-      lastname: this.UserProfileTestData.lastname,
-      desc: this.UserProfileTestData.desc,
+      form: {
+        first_name: this.userdata.first_name,
+        last_name: this.userdata.last_name,
+        desc: this.UserProfileTestData.desc,
+      },
     }
   },
-  props: {
-    UserProfileTestData: { type: Object },
-  },
   methods: {
     async onSubmit() {
-      // console.log(this.$props.UserProfileTestData)
-      const result = await loginAPI.updateUserdata(
-        this.sessionId,
-        this.email,
-        this.name,
-        this.lastname,
-        this.desc,
-      )
-      if (result.success) {
-        alert('updateUserdata success')
-      } else {
-        alert(result.result.message)
-      }
+      // this.$emit('update-userdata')
+      // console.log("form name:", this.first_name)
+      // console.log("form nachname:", this.last_name)
+      // console.log("form desc:", this.desc)
+      //  if (result.success) {
+      //    console.log("updateUserdata success")
+      //    console.log(result)
+      //
+      //  } else {
+      //    alert(result.result.message)
+      //  }
     },
   },
 }
diff --git a/frontend/src/views/Pages/UserProfile/UserCard_FormUsername.vue b/frontend/src/views/Pages/UserProfile/UserCard_FormUsername.vue
index a5c08cff4..7d073ec0e 100644
--- a/frontend/src/views/Pages/UserProfile/UserCard_FormUsername.vue
+++ b/frontend/src/views/Pages/UserProfile/UserCard_FormUsername.vue
@@ -7,9 +7,6 @@
             <span>{{ $t('form.username') }} {{ $t('form.change') }}</span>
           </a>
           <div v-else>
-            <a href="#formusername" @click="onSubmit">
-              <span class="mr-4 text-success display-4">{{ $t('form.save') }}</span>
-            </a>
             <a href="#formusername" @click="edit_username = !edit_username">
               <span>
                 <b>{{ $t('form.cancel') }}</b>
@@ -23,12 +20,21 @@
         <b-col class="col-lg-3 col-md-10 col-sm-10 text-md-left text-lg-right">
           <small>{{ $t('form.username') }}</small>
         </b-col>
-        <b-col v-if="edit_username" class="col-md-9 col-sm-10">@{{ username }}</b-col>
+        <b-col v-if="edit_username" class="col-md-9 col-sm-10">@{{ $store.state.username }}</b-col>
         <b-col v-else class="col-md-9 col-sm-10">
-          <b-input type="text" v-model="this.username"></b-input>
-          <div>
-            {{ $t('form.change_username_info') }}
-          </div>
+          <validation-observer v-slot="{ handleSubmit }" ref="formValidator">
+            <b-form role="form" @submit.prevent="handleSubmit(onSubmit)">
+              <b-form-input v-model="username" :placeholder="$store.state.username"></b-form-input>
+              <div>
+                {{ $t('form.change_username_info') }}
+              </div>
+              <div class="text-center" ref="submitButton">
+                <b-button type="submit" class="mt-4">
+                  {{ $t('form.save') }}
+                </b-button>
+              </div>
+            </b-form>
+          </validation-observer>
         </b-col>
       </b-row>
     </b-container>
@@ -42,12 +48,9 @@ export default {
   data() {
     return {
       edit_username: true,
-      username: this.UserProfileTestData.username,
+      username: '',
     }
   },
-  props: {
-    UserProfileTestData: { type: Object },
-  },
   methods: {
     async onSubmit() {
       // console.log(this.data)
diff --git a/frontend/src/views/Pages/UserProfileOverview.vue b/frontend/src/views/Pages/UserProfileOverview.vue
index c67afacfb..fb488bc5f 100644
--- a/frontend/src/views/Pages/UserProfileOverview.vue
+++ b/frontend/src/views/Pages/UserProfileOverview.vue
@@ -1,17 +1,19 @@
 <template>
   <b-container fluid>
     <user-card :balance="balance" :transactionCount="transactionCount"></user-card>
-
-    <form-user-data :UserProfileTestData="UserProfileTestData" />
-    <form-username :UserProfileTestData="UserProfileTestData" />
-    <form-user-mail />
+    <form-user-data
+      :userdata="userdata"
+      @update-userdata="updateUserdata"
+      :UserProfileTestData="UserProfileTestData"
+    />
+    <form-username />
     <form-user-passwort />
   </b-container>
 </template>
 <script>
+import loginAPI from '../../apis/loginAPI'
 import UserCard from './UserProfile/UserCard.vue'
 import FormUserData from './UserProfile/UserCard_FormUserData.vue'
-import FormUserMail from './UserProfile/UserCard_FormUserMail.vue'
 import FormUsername from './UserProfile/UserCard_FormUsername.vue'
 import FormUserPasswort from './UserProfile/UserCard_FormUserPasswort.vue'
 
@@ -19,7 +21,6 @@ export default {
   components: {
     UserCard,
     FormUserData,
-    FormUserMail,
     FormUsername,
     FormUserPasswort,
   },
@@ -28,7 +29,41 @@ export default {
     transactionCount: { type: Number, default: 0 },
     UserProfileTestData: { type: Object },
   },
-  methods: {},
+  data() {
+    return {
+      userdata: {},
+    }
+  },
+  methods: {
+    async getUserdata() {
+      const result = await loginAPI.getUserInfos(
+        this.$store.state.sessionId,
+        this.$store.state.email,
+      )
+      // console.log(result.result.data.userData)
+      if (result.success) {
+        this.userdata = result.result.data.userData
+      } else {
+        alert(result.result.message)
+      }
+    },
+    async updateUserdata(data) {
+      // console.log(data)
+      const result = await loginAPI.updateUserInfos(
+        this.$store.state.sessionId,
+        this.$store.state.email,
+      )
+      // console.log(result)
+      if (result.success) {
+        alert(result)
+      } else {
+        alert(result.result.message)
+      }
+    },
+  },
+  async created() {
+    this.getUserdata()
+  },
 }
 </script>
 <style></style>