diff --git a/PlantUMLEditor/Sources/CodeViewer/Resources/ace.bundle/index.html b/PlantUMLEditor/Sources/CodeViewer/Resources/ace.bundle/index.html
new file mode 100644
index 0000000..12e2399
--- /dev/null
+++ b/PlantUMLEditor/Sources/CodeViewer/Resources/ace.bundle/index.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>ACE in Action</title>
+<style type="text/css" media="screen">
+    #editor {
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+    }
+</style>
+</head>
+<body>
+
+<div id="editor">
+</div>
+    
+<script src="./ace.js" type="text/javascript" charset="utf-8"></script>
+<script src="./ext-language_tools.js"></script>
+<script src="./ext-emmet.js"></script>
+
+<script>
+    var editor = ace.edit("editor");
+    editor.setShowPrintMargin(false);
+    
+    editor.session.on('change', function(delta) {
+        let message = editor.getValue();
+        window.webkit.messageHandlers.aceEditorDidChanged.postMessage(message);
+    });
+
+    ace.require("ace/ext/language_tools");
+    editor.setOptions({
+        enableSnippets: true,
+        enableBasicAutocompletion: true,
+        enableLiveAutocompletion: true,
+        enableEmmet: true,
+        useWorker: false,
+        theme: "ace/theme/idle_fingers",
+        showPrintMargin: false,
+        showFoldWidgets: false
+    });
+
+    window.webkit.messageHandlers.aceEditorDidReady.postMessage(null); // Need at lead 1 arg
+</script>
+</body>
+</html>
