Change structure of code tor frontend and backend one

web/templates/editor.html

@@ -1,7 +1,12 @@
 {{define "page-content"}}
 <h2>Editor</h2>
 
-<form>
+<form id="edit-area">
+    <div class="btn-area">
+        <button class="btn" disabled hx-get="/hub" hx-target="#edit-area">Schreiben</button>
+        <button class="btn" hx-post="/preview-article" hx-target="#edit-area">Vorschau</button>
+    </div>
+
     <div class="flex flex-col gap-y-1">
         <label for="article-title">Titel</label>
         <input name="article-title" type="text" />
@@ -55,7 +60,6 @@
 
         document.body.removeChild(textarea);
     }
-
 </script>
 {{end}}
 
@@ -68,3 +72,23 @@
 </div>
 {{end}}
 {{end}}
+
+
+{{define "preview"}}
+<span>Titel</span>
+<div class="bg-white border mb-3 px-2 py-2 rounded-md w-full">
+    {{.Title}}
+</div>
+
+<span>Beschreibung</span>
+<div class="bg-white border mb-3 px-2 py-2 rounded-md w-full">
+    {{.Description}}
+</div>
+
+<span>Artikel</span>
+<div class="bg-white border mb-3 px-2 py-2 rounded-md w-full">
+    <div class="prose">
+        {{.Content}}
+    </div>
+</div>
+{{end}}