diff --git a/flaskr/app.py b/flaskr/app.py
index 4dcb0e4..82bfc88 100644
--- a/flaskr/app.py
+++ b/flaskr/app.py
@@ -31,17 +31,21 @@ def create_flask_app(s2c, c2s, s2flask, args):
             pass
         s2flask.get()
 
+    @app.route('/save', methods=['POST'])
+    def save():
+        send(s2c, 'save')
+        return '', 204
+
+    @app.route('/exit', methods=['POST'])
+    def exit():
+        send(c2s, 'close')
+        request.environ.get('werkzeug.server.shutdown')()
+        return '', 204
+
     @app.route('/', methods=['GET', 'POST'])
     def index():
         if request.method == 'POST':
-            if 'save' in request.form:
-                send(s2c, 'save')
-                return '', 204
-            elif 'exit' in request.form:
-                send(c2s, 'close')
-                request.environ.get('werkzeug.server.shutdown')()
-                return '', 204
-            elif 'update' in request.form:
+            if 'update' in request.form:
                 send_and_wait(c2s, 'update')
             elif 'next_preview' in request.form:
                 send_and_wait(c2s, 'next_preview')
diff --git a/flaskr/templates/index.html b/flaskr/templates/index.html
index f445fe3..cf21304 100644
--- a/flaskr/templates/index.html
+++ b/flaskr/templates/index.html
@@ -1,14 +1,44 @@
 <head>
+<!--    <link rel="stylesheet"-->
+<!--          href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"-->
+<!--          integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"-->
+<!--          crossorigin="anonymous">-->
+    <script src="https://code.jquery.com/jquery-3.4.1.min.js"
+            integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
+            crossorigin="anonymous"></script>
     <title>Flask Server Demonstration</title>
+    <script type="text/javascript">
+        $(function() {
+          $('button#save').click(function() {
+            $.post('/save');
+          });
+
+          $('button#exit').click(function() {
+            $.post('/exit');
+          });
+
+          // $('button#update').click(function() {
+          //   $.post('/update');
+          // });
+          //
+          // $('button#next_preview').click(function() {
+          //   $.post('/next_preview');
+          // });
+          //
+          // $('button#change_history_range').click(function() {
+          //   $.post('/change_history_range');
+          // });
+        });
+    </script>
 </head>
 <body>
 <h1>Flask Server Demonstration</h1>
 <form action="/" method="post">
-    <button name="save" value="save">Save</button>
-    <button name="exit" value="exit">Exit</button>
-    <button name="update" value="update">Update</button>
-    <button name="next_preview" value="next_preview">Next preview</button>
-    <button name="change_history_range" value="change_history_range">Change History Range</button>
+    <button class='btn btn-default' id='save'>Save</button>
+    <button class='btn btn-default' id='exit'>Exit</button>
+    <button class='btn btn-default' id='update' name="update" value="update">Update</button>
+    <button class='btn btn-default' id='next_preview' name="next_preview" value="next_preview">Next preview</button>
+    <button class='btn btn-default' id='change_history_range' name="change_history_range" value="change_history_range">Change History Range</button>
 </form>
 <img src="{{ url_for('preview_image') }}">
 </body>
