From 6d6a443c898c60655bcee274ebee4f1714163658 Mon Sep 17 00:00:00 2001
From: Nathan Woodburn <github@nathan.woodburn.au>
Date: Wed, 2 Jul 2025 15:55:50 +1000
Subject: [PATCH] feat: Add some readme info and add some more boilerplate code

---
 README.md                      | 20 +++++++++++++++--
 server.py                      | 29 +++++++++++++++++++++++-
 templates/assets/css/index.css | 21 +++++++++++++++++
 templates/index.html           | 41 ++++++++++++++++++++++++++++++++++
 4 files changed, 108 insertions(+), 3 deletions(-)

diff --git a/README.md b/README.md
index 2f77bf4..9206f25 100644
--- a/README.md
+++ b/README.md
@@ -1,3 +1,19 @@
-# python-webserver-template
+# Python Flask Webserver Template
 
-Python3 website template including git actions
\ No newline at end of file
+Python3 website template including git actions
+
+# Development
+1. Install requirements
+```bash
+python3 -m pip install -r requirements.txt
+```
+2. Run the dev server
+```bash
+python3 server.py
+```
+
+# Production
+Run using the main.py file
+```bash
+python3 main.py
+```
\ No newline at end of file
diff --git a/server.py b/server.py
index 240a1a8..d413b84 100644
--- a/server.py
+++ b/server.py
@@ -74,7 +74,9 @@ def wellknown(path):
 # region Main routes
 @app.route("/")
 def index():
-    return render_template("index.html")
+    # Get current time in the format "dd MMM YYYY hh:mm AM/PM"
+    current_datetime = datetime.now().strftime("%d %b %Y %I:%M %p")
+    return render_template("index.html", datetime=current_datetime)
 
 
 @app.route("/<path:path>")
@@ -102,6 +104,31 @@ def catch_all(path: str):
 # endregion
 
 
+# region API routes
+
+api_requests = 0
+
+@app.route("/api/v1/data", methods=["GET"])
+def api_data():
+    """
+    Example API endpoint that returns some data.
+    You can modify this to return whatever data you need.
+    """
+
+    global api_requests
+    api_requests += 1
+
+    data = {
+        "header": "Sample API Response",
+        "content": f"Hello, this is a sample API response! You have called this endpoint {api_requests} times.",
+        "timestamp": datetime.now().isoformat(),
+    }
+    return jsonify(data)
+
+
+# endregion
+
+
 # region Error Catching
 # 404 catch all
 @app.errorhandler(404)
diff --git a/templates/assets/css/index.css b/templates/assets/css/index.css
index 9635f9c..3ef53b7 100644
--- a/templates/assets/css/index.css
+++ b/templates/assets/css/index.css
@@ -17,4 +17,25 @@ a {
 }
 a:hover {
     text-decoration: underline;
+}
+
+/* Mike section styling */
+.mike-section {
+    margin-top: 30px;
+    max-width: 600px;
+    margin-left: auto;
+    margin-right: auto;
+    padding: 20px;
+    background-color: rgba(50, 50, 50, 0.3);
+    border-radius: 8px;
+}
+
+.mike-section h2 {
+    color: #f0f0f0;
+    margin-top: 0;
+}
+
+.mike-section p {
+    line-height: 1.6;
+    margin-bottom: 15px;
 }
\ No newline at end of file
diff --git a/templates/index.html b/templates/index.html
index bb349f8..f3aac2c 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -13,7 +13,48 @@
     <div class="spacer"></div>
     <div class="centre">
         <h1>Nathan.Woodburn/</h1>
+        <span>The current date and time is {{datetime}}</span>
     </div>
+
+    <div class="spacer"></div>
+    <div class="centre">
+        <h2 id="test-content-header">Pulling data</h2>
+        <span class="test-content">This is a test content area that will be updated with data from the server.</span>
+        <br>
+        <br>
+        <span class="test-content-timestamp">Timestamp: Waiting to pull data</span>
+    </div>
+
+    <script>
+        function fetchData() {
+            // Fetch the data from the server
+            fetch('/api/v1/data')
+                .then(response => response.json())
+                .then(data => {
+                    // Get the data header element
+                    const dataHeader = document.getElementById('test-content-header');
+                    // Update the header with the fetched data
+                    dataHeader.textContent = data.header;
+                    // Get the test content element
+                    const testContent = document.querySelector('.test-content');
+                    // Update the content with the fetched data
+                    testContent.textContent = data.content;
+
+                    // Get the timestamp element
+                    const timestampElement = document.querySelector('.test-content-timestamp');
+                    // Update the timestamp with the fetched data
+                    timestampElement.textContent = `Timestamp: ${data.timestamp}`;
+                })
+                .catch(error => console.error('Error fetching data:', error));
+        }
+
+        // Initial fetch after 2 seconds
+        setTimeout(fetchData, 2000);
+        
+        // Then fetch every 2 seconds
+        setInterval(fetchData, 2000);
+    </script>
+
 </body>
 
 </html>
\ No newline at end of file