diff --git a/io.sc.platform.core.frontend/src/views/Codemirror.vue b/io.sc.platform.core.frontend/src/views/Codemirror.vue
index 5d79fb32..8feee994 100644
--- a/io.sc.platform.core.frontend/src/views/Codemirror.vue
+++ b/io.sc.platform.core.frontend/src/views/Codemirror.vue
@@ -1,8 +1,28 @@
 <template>
-  <w-codemirror v-model="value" lang="xml" style="height: 60px"></w-codemirror>
+  <!-- <w-codemirror
+    v-model="value"
+    lang="xml"
+    placeholder="Code goes here..."
+    :autofocus="false"
+    :tab-size="2"
+    :style="{ height: '200px', padding: '20px' }"
+  ></w-codemirror> -->
+  <div ref="codemirrorRef"></div>
 </template>
 <script setup lang="ts">
-import { ref } from 'vue';
+import { ref, onMounted, onUnmounted } from 'vue';
+import { EditorView, basicSetup } from 'codemirror';
+import { javascript } from '@codemirror/lang-javascript';
 
-const value = ref('<xml><a name="name"></a>');
+const codemirrorRef = ref();
+
+onMounted(() => {
+  let view = new EditorView({
+    extensions: [basicSetup, javascript()],
+    parent: codemirrorRef.value,
+  });
+});
+
+onUnmounted(() => {});
+const value = ref('<xml><a name="name"></a></xml>');
 </script>