Added user model; added pages to register a new account, login and logout; added middleware to process whether a user is logged in or not

views/auth/login.twig

@@ -0,0 +1,40 @@
+{% extends 'layout.twig' %}
+
+{% block title %}Home{% endblock %}
+
+{% block content %}
+
+<!-- page header -->
+<header class="row">
+  <div class="columns twelve">
+    <h1>Login to your account.</h1>
+  </div>
+</header>
+
+<section id="record-actions" class="row">
+  <div class="three columns">
+    <p>.</p>
+  </div>
+
+  <div class="six columns">
+    <form class="u-full-width" action="/auth/login" method="POST">
+      <div class="row">
+        <label for="login_username">
+          Username:
+          <input type="text" id="login_username" class="u-full-width" name="login_username" placeholder="myuser1">
+        </label>
+      </div>
+
+      <div class="twelve columns">
+        <label for="login_password">
+          Password:
+          <input type="password" id="login_password" class="u-full-width" name="login_password" placeholder="Enter your password...">
+        </label>
+      </div>
+
+      <input type="submit" class="button-primary u-full-width" value="Login">
+    </form>
+  </div>
+</section>
+
+{% endblock %}

views/auth/register.twig

@@ -0,0 +1,67 @@
+{% extends 'layout.twig' %}
+
+{% block title %}Home{% endblock %}
+
+{% block content %}
+
+<!-- page header -->
+<header class="row">
+  <div class="columns twelve">
+    <h1>Register for a new account.</h1>
+  </div>
+</header>
+
+<section id="record-actions" class="row">
+  <div class="three columns">
+    <p>.</p>
+  </div>
+
+  <div class="six columns">
+    <form class="u-full-width" action="/auth/register" method="POST">
+      <div class="row">
+        <div class="six columns">
+          <label for="register_username">
+            Username:
+            <input type="text" id="register_username" class="u-full-width" name="register_username" placeholder="myuser1">
+          </label>
+        </div>
+
+        <div class="six columns">
+          <label for="register_password">
+            Password:
+            <input type="password" id="register_password" class="u-full-width" name="register_password" placeholder="Enter your password...">
+          </label>
+        </div>
+      </div>
+
+      <div class="row">
+        <div class="twelve columns">
+          <label for="register_email">
+            Email address:
+            <input type="email" id="register_email" class="u-full-width" name="register_email" placeholder="myemail@example.com">
+          </label>
+        </div>
+      </div>
+
+      <div class="row">
+        <div class="six columns">
+          <label for="register_first_name">
+            First name:
+            <input type="text" id="register_first_name" class="u-full-width" name="register_first_name" placeholder="Firstname">
+          </label>
+        </div>
+
+        <div class="six columns">
+          <label for="register_last_name">
+            Last name:
+            <input type="password" id="register_last_name" class="u-full-width" name="register_last_name" placeholder="Lastname">
+          </label>
+        </div>
+      </div>
+
+      <input type="submit" class="button-primary u-full-width" value="Register account">
+    </form>
+  </div>
+</section>
+
+{% endblock %}

views/layout.twig

@@ -33,6 +33,14 @@
 
           <button id="search-button" type="submit" for="search-form"><i class="fa-solid fa-magnifying-glass"></i></button>
         </li>
+
+        {% if user %}
+          <li class="nav-link"><a href="/account">{{ user.username }}</a></li>
+          <li class="nav-link"><a href="/auth/logout">Logout</a></li>
+        {% else %}
+          <li class="nav-link"><a href="/auth/register">Register</a></li>
+          <li class="nav-link"><a href="/auth/login">Login</a></li>
+        {% endif %}
       </ul>
     </div>
   </nav>