diff --git a/templates/footer.html b/templates/footer.html
new file mode 100644
index 0000000..2018aaf
--- /dev/null
+++ b/templates/footer.html
@@ -0,0 +1,5 @@
+<div id=footer0div>
+    <footer>
+        <a href="/">Main page</a>
+    </footer>
+</div>
\ No newline at end of file
diff --git a/templates/json2html_template.html b/templates/json2html_template.html
new file mode 100644
index 0000000..0c50be3
--- /dev/null
+++ b/templates/json2html_template.html
@@ -0,0 +1,40 @@
+        <script src="/js/json2htmltable.js"></script>
+         <script type="text/javascript">
+            window.addEventListener("load", () => {
+                let xhr = new XMLHttpRequest();
+                let api_endpoint = location.protocol + '//' + location.host + '/api' + location.pathname + location.search;
+                table = document.getElementById('table0div');
+                xhr.open('GET', api_endpoint)
+
+                xhr.onload = function() {
+                    table = document.getElementById('table0div');
+                    table.innerHTML = '';
+                    table.appendChild(buildHtmlTable(JSON.parse(xhr.response))); // build table
+
+                    var table = document.querySelector("#table0div > table")
+                    var header = table.rows[0]
+
+                    for (var i = 0, cell; cell = header.cells[i]; i++) {
+                        if (cell.innerText.includes('{{ target_column_name }}')) {
+                            var target_column_id = i;
+                            break;
+                        }
+                    }
+
+                    if (target_column_id == null) { // don't to anything if no action_id in the table
+                        return;
+                    }
+
+                    for (var i = 1, row; row = table.rows[i]; i++) { // append to target column filed href
+                        row.cells[target_column_id].innerHTML = '<td><a href="' + '{{ target_new_url }}' + table.rows[i].cells[target_column_id].innerText + ' ">' + table.rows[i].cells[target_column_id].innerText + '</a></td>';
+                    }
+                }
+
+                xhr.onerror = function() { // происходит, только когда запрос совсем не получилось выполнить
+                    table.innerHTML = 'Loading Error';
+                };
+
+                xhr.send()
+                table.innerHTML = 'Loading...';
+            })
+        </script>
\ No newline at end of file
diff --git a/templates/table_template.html b/templates/table_template.html
new file mode 100644
index 0000000..5b9224b
--- /dev/null
+++ b/templates/table_template.html
@@ -0,0 +1,13 @@
+<!DOCTYPE HTML>
+<html lang="en-US">
+    <head>
+        <meta charset="UTF-8">
+        {{ @json2html_template.html }}
+        <link type="text/css" rel="stylesheet" href="/js/table_styles.css">
+    </head>
+    <body>
+        <div id="table0div">
+        </div>
+        {{ @footer.html }}
+    </body>
+</html>
\ No newline at end of file
diff --git a/templates_engine.py b/templates_engine.py
new file mode 100644
index 0000000..7324d4e
--- /dev/null
+++ b/templates_engine.py
@@ -0,0 +1,33 @@
+"""
+Features:
+include files
+insert variables from context dict
+"""
+from os.path import join
+import re
+templates_dir = 'templates'
+
+variable_pattern: re.Pattern = re.compile(r'\{\{ .* }}')
+include_pattern: re.Pattern = re.compile(r'\{\{ @.* }}')
+
+
+def render(template_name: str, context: dict):
+    template_path = join(templates_dir, template_name)
+    template = get_file_content(template_path)
+
+    for include_statement in re.findall(include_pattern, template):
+        file_include = include_statement.split(' ')[1][1:]
+        include_content = get_file_content(join(templates_dir, file_include))
+        template = template.replace(include_statement, include_content)
+
+    for var_to_replace in re.findall(variable_pattern, template):
+        key = var_to_replace.split(' ')[1]
+        template = template.replace(var_to_replace, context[key])
+
+    return template
+
+
+def get_file_content(filename: str) -> str:
+    with open(filename, 'r', encoding='utf-8') as file:
+        # it will throw exception if file doesn't exist
+        return file.read()
diff --git a/web.py b/web.py
index e9dc8a1..dcda109 100644
--- a/web.py
+++ b/web.py
@@ -5,6 +5,7 @@ import os
 from EDMCLogging import get_main_logger
 import utils
 from model.sqlite_cache import cache
+from templates_engine import render
 
 """
 /leaderboard/{leaderboard_type}/platform/{platform}?[limit=<int>
@@ -57,14 +58,14 @@ class Activity:
 class ActivityHtml:
     def on_get(self, req: falcon.request.Request, resp: falcon.response.Response, leaderboard: str, platform: str)\
             -> None:
-        Activity().on_get(req, resp, leaderboard, platform)
-        table_in_json: str = resp.text
         resp.content_type = falcon.MEDIA_HTML
 
-        resp.text = utils.activity_table_html_template.replace(
-            '{items}', table_in_json
-        ).replace('{target_column_name}', 'ActionId').replace('{target_new_url}', '/diff/')
-        # what? f-strings? .format? never heard about them
+        resp.text = render(
+            'table_template.html',
+            {
+                'target_column_name': 'ActionId',
+                'target_new_url': '/diff/',
+             })
 
 
 class ActivityDiff:
@@ -85,10 +86,13 @@ class ActivityDiff:
 class ActivityDiffHtml:
     def on_get(self, req: falcon.request.Request, resp: falcon.response.Response, action_id: int) -> None:
         resp.content_type = falcon.MEDIA_HTML
-        # table: str = json.dumps(model.get_diff_action_id(action_id))
-        resp.text = utils.activity_table_html_template.replace(
-            '{items}', json.dumps(model.get_diff_action_id(action_id))
-        ).replace('{target_column_name}', 'Tag').replace('{target_new_url}', '/jub/squads/now/by-tag/')
+        resp.text = render(
+            'table_template.html',
+            {
+                'target_column_name': 'Tag',
+                'target_new_url': '/jub/squads/now/by-tag/'
+            }
+        )
 
 
 class MainPage:
