display threads (poorly)

backend/main.py

@@ -1,4 +1,5 @@
 from fastapi import FastAPI
+from fastapi.middleware.cors import CORSMiddleware
 
 import models
 from database import engine
@@ -6,6 +7,14 @@ from routers import auth, forum
 
 app = FastAPI()
 
+app.add_middleware(
+    CORSMiddleware,
+    allow_origins=['*'],
+    allow_credentials=False,
+    allow_methods=['GET', 'POST'],
+    allow_headers=['*']
+)
+
 models.Base.metadata.create_all(bind=engine)
 
 app.include_router(forum.router)

frontend/src/assets/js/app.js

@@ -1,9 +1,32 @@
-const apiUrl = 'http://localhost:8000/api';
+const apiUrl = 'http://localhost:8001';
 
+function createTable(selector, items) {
+    const $table = $("<table></table>");
+    const $headerRow = $("<tr></tr>");
+
+    $.each(Object.keys(items[0]), function(i, key) {
+       const $th = $("<th></th>").text(key)
+        $headerRow.append($th);
+    });
+    $table.append($headerRow);
+
+    $.each(items, function (i, item) {
+       const $tr = $("<tr></tr>");
+       $.each(item, function(key, value) {
+          const $td = $("<td></td>").text(value);
+          $tr.append($td);
+       });
+       $table.append($tr);
+    });
+
+    console.log($table);
+
+    $(selector).append($table);
+}
 function getCatalog() {
     $.getJSON(apiUrl + "/catalog", function (resp) {
-        document.write(resp.text);
+        createTable('.posts', resp);
-    })
+    });
 }
 $( document ).ready(function() {
     getCatalog();