diff --git a/config/routes/chill_assets_dev.yaml b/config/routes/chill_assets_dev.yaml
index ea4a9c424..8d4e17f84 100644
--- a/config/routes/chill_assets_dev.yaml
+++ b/config/routes/chill_assets_dev.yaml
@@ -17,3 +17,9 @@ when@dev:
         defaults:
             template: '@ChillMain/Dev/dev.assets.test2.html.twig'
 
+
+    sass_address_picker:
+        path: /_dev/address-picker
+        controller: Symfony\Bundle\FrameworkBundle\Controller\TemplateController
+        defaults:
+            template: '@ChillMain/Dev/dev.address-picker.html.twig'
diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/AddressPicker/AddressPicker.vue b/src/Bundle/ChillMainBundle/Resources/public/vuejs/AddressPicker/AddressPicker.vue
new file mode 100644
index 000000000..6f17c5de1
--- /dev/null
+++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/AddressPicker/AddressPicker.vue
@@ -0,0 +1,22 @@
+<script setup lang="ts">
+
+import {Address} from "ChillMainAssets/types";
+
+interface AddressPickerProps {
+    suggestions?: Address[];
+}
+
+const props = withDefaults(defineProps<AddressPickerProps>(), {
+    suggestions: []
+});
+
+
+</script>
+
+<template>
+<p>test</p>
+</template>
+
+<style scoped lang="scss">
+
+</style>
diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/AddressPicker/index.ts b/src/Bundle/ChillMainBundle/Resources/public/vuejs/AddressPicker/index.ts
new file mode 100644
index 000000000..8095e0ba5
--- /dev/null
+++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/AddressPicker/index.ts
@@ -0,0 +1,10 @@
+import {createApp} from "vue";
+import AddressPicker from "ChillMainAssets/vuejs/AddressPicker/AddressPicker.vue";
+
+document.addEventListener('DOMContentLoaded', async () => {
+    document.querySelectorAll<HTMLDivElement>('div[data-address-picker]').forEach((elem): void  => {
+        const app = createApp(AddressPicker);
+
+        app.mount(elem);
+    })
+})
diff --git a/src/Bundle/ChillMainBundle/Resources/views/Dev/dev.address-picker.html.twig b/src/Bundle/ChillMainBundle/Resources/views/Dev/dev.address-picker.html.twig
new file mode 100644
index 000000000..398e7e35c
--- /dev/null
+++ b/src/Bundle/ChillMainBundle/Resources/views/Dev/dev.address-picker.html.twig
@@ -0,0 +1,15 @@
+{% extends '@ChillMain/layout.html.twig' %}
+
+{% block css %}
+    {{ encore_entry_link_tags('address_picker') }}
+{% endblock %}
+
+{% block js %}
+    {{ encore_entry_script_tags('address_picker') }}
+{% endblock %}
+
+{% block content %}
+
+    <div data-address-picker="data-address-picker"></div>
+
+{% endblock %}
diff --git a/src/Bundle/ChillMainBundle/chill.webpack.config.js b/src/Bundle/ChillMainBundle/chill.webpack.config.js
index 011fc9559..e791ff0e3 100644
--- a/src/Bundle/ChillMainBundle/chill.webpack.config.js
+++ b/src/Bundle/ChillMainBundle/chill.webpack.config.js
@@ -120,5 +120,9 @@ module.exports = function (encore, entries) {
     "vue_onthefly",
     __dirname + "/Resources/public/vuejs/OnTheFly/index.js",
   );
+  encore.addEntry(
+    'address_picker',
+    __dirname + "/Resources/public/vuejs/AddressPicker/index.ts",
+  )
 
 };