diff --git a/tools/web_monitor/app.py b/tools/web_monitor/app.py
index 401835ad..68aad1ec 100644
--- a/tools/web_monitor/app.py
+++ b/tools/web_monitor/app.py
@@ -1,15 +1,22 @@
-import socketio
-from sanic import Sanic
+import json
+import asyncio
+import uvicorn
+from fastapi import FastAPI
+from fastapi import Request
+from fastapi import WebSocket
+from fastapi.templating import Jinja2Templates
+from fastapi.staticfiles import StaticFiles
-app = Sanic("App")
+app = FastAPI()
-# attach socketio
-sio = socketio.AsyncServer(async_mode="sanic")
-sio.attach(app)
+app.mount("/static", StaticFiles(directory="static"), name="static")
+templates = Jinja2Templates(directory="templates")
-app.static('/', "./public/index.html")
-app.static('/index.css', "./static/index.css")
-app.static('/index.js', "./static/index.js")
-app.static('/scan', "./public/scan.html")
-app.static('/settings', "./public/settings.html")
+@app.route("/")
+def dashboard(request: Request):
+ return templates.TemplateResponse("index.html", {"request": request})
+
+
+if __name__ == "__main__":
+ uvicorn.run("app:app", host="127.0.0.1", port=80, debug=True)
diff --git a/tools/web_monitor/public/scan.html b/tools/web_monitor/public/scan.html
deleted file mode 100644
index 04335d02..00000000
--- a/tools/web_monitor/public/scan.html
+++ /dev/null
@@ -1,115 +0,0 @@
-
-
-
-
-
-
-
- Title
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/tools/web_monitor/public/settings.html b/tools/web_monitor/public/settings.html
deleted file mode 100644
index 3bd096cf..00000000
--- a/tools/web_monitor/public/settings.html
+++ /dev/null
@@ -1,115 +0,0 @@
-
-
-
-
-
-
-
- Title
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/tools/web_monitor/static/index.js b/tools/web_monitor/static/index.js
deleted file mode 100644
index 7c2402ae..00000000
--- a/tools/web_monitor/static/index.js
+++ /dev/null
@@ -1,53 +0,0 @@
-/* globals Chart:false, feather:false */
-
-(function () {
- 'use strict'
-
- feather.replace({ 'aria-hidden': 'true' })
-
- // Graphs
- var ctx = document.getElementById('myChart')
- // eslint-disable-next-line no-unused-vars
- var myChart = new Chart(ctx, {
- type: 'line',
- data: {
- labels: [
- 'Sunday',
- 'Monday',
- 'Tuesday',
- 'Wednesday',
- 'Thursday',
- 'Friday',
- 'Saturday'
- ],
- datasets: [{
- data: [
- 15339,
- 21345,
- 18483,
- 24003,
- 23489,
- 24092,
- 12034
- ],
- lineTension: 0,
- backgroundColor: 'transparent',
- borderColor: '#007bff',
- borderWidth: 4,
- pointBackgroundColor: '#007bff'
- }]
- },
- options: {
- scales: {
- yAxes: [{
- ticks: {
- beginAtZero: false
- }
- }]
- },
- legend: {
- display: false
- }
- }
- })
-})()
diff --git a/tools/web_monitor/static/index.css b/tools/web_monitor/static/navbar.css
similarity index 100%
rename from tools/web_monitor/static/index.css
rename to tools/web_monitor/static/navbar.css
diff --git a/tools/web_monitor/templates/index.html b/tools/web_monitor/templates/index.html
new file mode 100644
index 00000000..b83f025d
--- /dev/null
+++ b/tools/web_monitor/templates/index.html
@@ -0,0 +1,4 @@
+{% extends 'navbar.html'%}
+{% block content %}
+Hi
+{% endblock content %}
diff --git a/tools/web_monitor/public/index.html b/tools/web_monitor/templates/navbar.html
similarity index 96%
rename from tools/web_monitor/public/index.html
rename to tools/web_monitor/templates/navbar.html
index 0298cca6..0293c1e4 100644
--- a/tools/web_monitor/public/index.html
+++ b/tools/web_monitor/templates/navbar.html
@@ -3,7 +3,7 @@
-
+
Title
@@ -51,7 +51,7 @@
-
-
+
Dashboard
@@ -108,6 +108,9 @@
+ {% block content %}
+
+ {% endblock content %}