Added draggable and router

src/App.vue

@@ -5,8 +5,16 @@ import HelloWorld from './components/HelloWorld.vue'
 </script>
 
 <template>
-  <img alt="Vue logo" src="./assets/logo.png" />
-  <HelloWorld msg="Hello Vue 3 + TypeScript + Vite" />
+  <div id = "sidebar">
+
+  </div>
+
+  <div id = "main">
+    <img alt="Vue logo" src="./assets/logo.png" />
+    <git msg="Hello Vue 3 + TypeScript + Vite" />
+  </div>
+
+  
 </template>
 
 <style>
@@ -18,4 +26,5 @@ import HelloWorld from './components/HelloWorld.vue'
   color: #2c3e50;
   margin-top: 60px;
 }
+
 </style>

src/components/Sidebar.vue

@@ -0,0 +1,10 @@
+<script setup></script>
+
+<template>
+  <div
+    v-draggable="/* Pass DraggableProps as binding value here */"
+    class="box"
+  >
+    I use a directive to make myself draggable
+  </div>
+</template>

src/main.ts

@@ -1,4 +1,9 @@
 import { createApp } from 'vue'
 import App from './App.vue'
+import Draggable, { DraggablePlugin, DraggableDirective } from '@braks/revue-draggable'
 
-createApp(App).mount('#app')
+
+const app = createApp(App)
+
+app.use(DraggablePlugin)
+app.mount('#app')