From 9ab1f464a132b8b54ee8d4cdc8f9e1e75bed6728 Mon Sep 17 00:00:00 2001
From: Dave Smith-Hayes <me@davesmithhayes.com>
Date: Tue, 29 Oct 2024 21:17:49 -0400
Subject: [PATCH] Flesh out the styles and finish the slides.

---
 chat-app/static/css/main.css | 15 ++++-----
 slides/deployment.html       | 61 +++++++++++++++++++++++++++++++-----
 2 files changed, 61 insertions(+), 15 deletions(-)

diff --git a/chat-app/static/css/main.css b/chat-app/static/css/main.css
index 596c5de..491edb8 100644
--- a/chat-app/static/css/main.css
+++ b/chat-app/static/css/main.css
@@ -57,17 +57,18 @@ div {
     padding: 1em 1.25em;
     margin-right: 1em;
     box-sizing: border-box;
-    font-famil: monospace !important;
+    font-family: monospace !important;
 }
-.chat-input > form > submit {
-    background-color: #020a03;
-    border: none;
+.chat-input > form > input[type=submit] {
+    background-color: #dacaae;
+    border: 1px solid #010a02;
     border-radius: 5px;
-    color: #fffbf6;
+    color: #0c0b09;
     font-weight: bold;
     padding: 0.75em 1em;
     margin-right: 0;
 }
+
 .chat-input > form > input[name="chatter"] {
     width: 20%;
     border: 1px solid #020a03;
@@ -109,12 +110,12 @@ div {
     }
 
     .chat-input > form > input[name="message"] {
-        width: 60%;
+        width: 65%;
         order: 2;
     }
 
     .chat-input > form > input[type=submit] {
-        width: 34%;
+        width: 30%;
         order: 3;
     }
 }
diff --git a/slides/deployment.html b/slides/deployment.html
index 8360903..38d279c 100644
--- a/slides/deployment.html
+++ b/slides/deployment.html
@@ -35,10 +35,9 @@
             <section>
                 <h1>Dave Smith-Hayes</h1>
                 <ul>
-                    <li class="fragment">Developer</li>
                     <li class="fragment">Father</li>
+                    <li class="fragment">Developer</li>
                     <li class="fragment">JavaScript Enjoyer</li>
-                    <li class="fragment">Web Software Deployer</li>
                 </ul>
             </section>
 
@@ -65,16 +64,27 @@
 
             <section>
                 <ul>
-                    <li class="fragment">cPanel File Manager</li>
+                    <li>cPanel File Manager</li>
                     <li class="fragment">FTP to Shared Hosting</li>
                     <li class="fragment"><code>$ git pull</code></li>
                     <li class="fragment">Jenkins &amp; Ansible build VM Images</li>
-                    <li class="fragment">Packer &amp; Terraform build Continers</li>
+                    <li class="fragment">Packer &amp; Terraform build Containers</li>
+                </ul>
+            </section>
+
+            <section>
+                <h2>Deployment Methods</h2>
+                <ul>
+                    <li class="fragment">In Place</li>
+                    <li class="fragment">Rolling</li>
+                    <li class="fragment">Immutable</li>
+                    <li class="fragment">Green/Blue</li>
                 </ul>
             </section>
 
             <section>
                 <h2>Doing it Yourself</h2>
+                <h3 class="fragment">What do you need?</h3>
                 <ul>
                     <li class="fragment">A domain</li>
                     <li class="fragment">A server with a public IP address</li>
@@ -86,8 +96,9 @@
             <!-- Dokku -->
             <section>
                 <h2>Dokku</h2>
-                <p>Self-hosted platform as a service</p>
-                <p>Your very own Heroku</p>
+                <p>Self-hosted <strong>P</strong>latform as a <strong>S</strong>ervice (PaaS)</p>
+                <p>Your very own <em>Heroku*</em></p>
+                <p class="fragment"><small><em>*I have never used Heroku</em></small></p>
             </section>
 
             <section>
@@ -103,20 +114,54 @@
                 </ul>
             </section>
 
+            <section>
+                <h2>How Dokku Works</h2>
+                <ul>
+                    <li>Sets up Application</li>
+                    <li>Becomes a Git remote repository</li>
+                    <li>Builds and deploys the app behind NGiNX</li>
+                </ul>
+            </section>
+
+            <section>
+                <h2>Builders</h2>
+                <ul>
+                    <li>Heroku Buildpacks</li>
+                    <li>Dockerfile</li>
+                    <li>Nixpacks</li>
+                </ul>
+            </section>
+
+            <section>
+                <h2>Plugins</h2>
+                <ul>
+                    <li>Let's Encrypt</li>
+                    <li>Databases (MySQL, Postgres)</li>
+                </ul>
+            </section>
+
+            <section>
+                <h1>Demo</h1>
+            </section>
+
             <section>
                 <h3>Anatomy of the Server</h3>
                 <ul>
                     <li>Linode VPS</li>
                     <li>Debian</li>
+                    <li>Nameservers</li>
                 </ul>
             </section>
 
             <section>
                 <h3>Anatomy of the Application</h3>
                 <ul>
-                    <li>Hono Web Server Application</li>
-                    <li>Mithril.js Frontend Application</li>
+                    <li>Chat Application</li>
+                    <li>Hono Backend</li>
+                    <li>Mithril.js Frontend</li>
+                    <li>Bun!</li>
                     <li>Dockerized</li>
+                    <li><a href="https://chat.freedoom.party">chat.freedoom.party</a></li>
                 </ul>
             </section>