init vue app (frontend)

app/assets/vue/components/App.vue

@@ -0,0 +1,21 @@
+<template>
+   <div id="boum">
+      <div>hello <b>{{ username }}</b></div>
+      <div><b>{{ age }}</b> ans</div>
+      <input v-model="username">
+   </div>
+</template>
+
+<script>
+export default {
+   name: 'app',
+   props: ['dataset'],
+   data() {
+      return {
+         user: this.dataset.user,
+         username: this.dataset.user.username,
+         age: this.dataset.user.age,
+      }
+   }
+}
+</script>

app/assets/vue/index.js

@@ -0,0 +1,16 @@
+import { createApp } from 'vue'
+import App from './components/App.vue'
+
+const div = document.querySelector('div#app');
+console.log(div);
+
+const vue = createApp({
+    template: `<app :dataset="this.dataset" ></app>`,
+    data() {
+        return {
+            dataset: JSON.parse(div.dataset.app),
+        }
+    },
+})
+.component('app', App)
+.mount('#app');