added about page

learned about updating values with set interval

.gitignore

@@ -0,0 +1,2 @@
+
+.DS_Store

app.py

@@ -1,5 +1,6 @@
 from flask import Flask, render_template, request, redirect, url_for
 from models import db, Item
+from datetime import datetime as dt
 
 app = Flask(__name__)
 app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///items.db'
@@ -32,5 +33,8 @@ def add_item():
         return redirect(url_for('home'))
     return render_template('add_item.html')
 
+@app.route('/about')
+def about():
+    return render_template('about.html', now=dt.now())
 if __name__ == '__main__':
     app.run(debug=True)

templates/about.html

@@ -0,0 +1,26 @@
+{% extends "base.html" %}
+{% block content %}
+<h1 id="datetime" data-time="{{now.isoformat()}}">{{now.isoformat()}}</h1>
+<script>
+    // JavaScript to update the datetime dynamically
+    function updateTime() {
+        const dateElement = document.getElementById('datetime');
+        const currentTime = new Date(dateElement.dataset.time);
+
+        // Increment the datetime by 1 second
+        currentTime.setSeconds(currentTime.getSeconds() + 1);
+
+        // Format the datetime as a readable string
+        const formattedTime = currentTime.toLocaleString();
+
+        // Update the displayed datetime
+        dateElement.textContent = formattedTime;
+
+        // Update the data-time attribute for the next update
+        dateElement.dataset.time = currentTime.toISOString();
+    }
+
+    // Update the datetime every second
+    setInterval(updateTime, 1000);
+</script>
+{% endblock %}

templates/base.html

@@ -11,6 +11,7 @@
         <nav>
             <a href="{{ url_for('home') }}">Home</a>
             <a href="{{ url_for('add_item') }}">Add Item</a>
+            <a href="{{ url_for('about') }}">About</a>
         </nav>
     </header>
     <main>