Add to the talk JS.

chat-app/static/js/index.js

@@ -79,6 +79,11 @@ var require_hasOwn = __commonJS((exports, module) => {
 
 // node_modules/mithril/render/hyperscript.js
 var require_hyperscript = __commonJS((exports, module) => {
+  var Vnode = require_vnode();
+  var hyperscriptVnode = require_hyperscriptVnode();
+  var hasOwn = require_hasOwn();
+  var selectorParser = /(?:(^|#|\.)([^#\.\[\]]+))|(\[(.+?)(?:\s*=\s*("|'|)((?:\\["'\]]|.)*?)\5)?\])/g;
+  var selectorCache = {};
   function isEmpty(object) {
     for (var key in object)
       if (hasOwn.call(object, key))
@@ -147,11 +152,6 @@ var require_hyperscript = __commonJS((exports, module) => {
     vnode.tag = selector;
     return vnode;
   }
-  var Vnode = require_vnode();
-  var hyperscriptVnode = require_hyperscriptVnode();
-  var hasOwn = require_hasOwn();
-  var selectorParser = /(?:(^|#|\.)([^#\.\[\]]+))|(\[(.+?)(?:\s*=\s*("|'|)((?:\\["'\]]|.)*?)\5)?\])/g;
-  var selectorCache = {};
   module.exports = hyperscript;
 });
 
@@ -187,6 +187,7 @@ var require_hyperscript2 = __commonJS((exports, module) => {
 
 // node_modules/mithril/render/domFor.js
 var require_domFor = __commonJS((exports, module) => {
+  var delayedRemoval = new WeakMap;
   function* domFor({ dom, domSize }, { generation } = {}) {
     if (dom != null)
       do {
@@ -198,7 +199,6 @@ var require_domFor = __commonJS((exports, module) => {
         dom = nextSibling;
       } while (domSize);
   }
-  var delayedRemoval = new WeakMap;
   module.exports = {
     delayedRemoval,
     domFor
@@ -1480,13 +1480,6 @@ var require_censor = __commonJS((exports, module) => {
 
 // node_modules/mithril/api/router.js
 var require_router = __commonJS((exports, module) => {
-  function decodeURIComponentSave(component) {
-    try {
-      return decodeURIComponent(component);
-    } catch (e) {
-      return component;
-    }
-  }
   var Vnode = require_vnode();
   var m = require_hyperscript();
   var buildPathname = require_build2();
@@ -1495,6 +1488,13 @@ var require_router = __commonJS((exports, module) => {
   var assign = require_assign();
   var censor = require_censor();
   var sentinel = {};
+  function decodeURIComponentSave(component) {
+    try {
+      return decodeURIComponent(component);
+    } catch (e) {
+      return component;
+    }
+  }
   module.exports = function($window, mountRedraw) {
     var callAsync = $window == null ? null : typeof $window.setImmediate === "function" ? $window.setImmediate : $window.setTimeout;
     var p = Promise.resolve();
@@ -1721,18 +1721,34 @@ var import_mithril = __toESM(require_mithril(), 1);
 
 // frontend/websocket.js
 function createWebSocket() {
-  let appUrl = "localhost:3000";
+  let appUrl = "undefined";
   appUrl = `//${appUrl}/chat-service`;
   return new WebSocket(appUrl);
 }
 
 // frontend/index.js
+var messages = [];
+var socket = createWebSocket();
+socket.onmessage = function(event) {
+  if (event.type === "message") {
+    const message = JSON.parse(event.data);
+    messages.push(message);
+    import_mithril.default.redraw();
+  }
+};
 function newMessageText(name, message) {
   return [
     import_mithril.default("span.chatter", name + ": "),
     import_mithril.default("span.chatter-message", message)
   ];
 }
+var MessageBox = {
+  view: function() {
+    return import_mithril.default(".messages", { id: "message-box" }, messages.reverse().map(function(message) {
+      return import_mithril.default(".message", newMessageText(message.chatter, message.message));
+    }), import_mithril.default("#anchor"));
+  }
+};
 function clearMessageInputBox() {
   const messageBox = document.getElementById("message");
   messageBox.value = "";
@@ -1747,22 +1763,6 @@ function sendMessage(e) {
   socket.send(JSON.stringify(message));
   clearMessageInputBox();
 }
-var messages = [];
-var socket = createWebSocket();
-socket.onmessage = function(event) {
-  if (event.type === "message") {
-    const message = JSON.parse(event.data);
-    messages.push(message);
-    import_mithril.default.redraw();
-  }
-};
-var MessageBox = {
-  view: function() {
-    return import_mithril.default(".messages", { id: "message-box" }, messages.reverse().map(function(message) {
-      return import_mithril.default(".message", newMessageText(message.chatter, message.message));
-    }), import_mithril.default("#anchor"));
-  }
-};
 var MessageInput = {
   view: function() {
     return import_mithril.default("div.chat-input", [

slides/deployment.html

@@ -76,18 +76,19 @@
             <section>
                 <h2>Doing it Yourself</h2>
                 <ul>
-                    <li>Do not use AWS, its too expensive</li>
+                    <li class="fragment">A domain</li>
-                    <li>Your small project is not worth the cost</li>
+                    <li class="fragment">A server with a public IP address</li>
-                    <li>Use a small VPS from DigitalOcean or Linode</li>
+                    <li class="fragment">A webserver</li>
-                    <li>Get a public IP address and root access</li>
+                    <li class="fragment">Patience</li>
                 </ul>
             </section>
 
-            <section>
-                <h3>Blue/Green Deployment</h3>
-            </section>
-
             <!-- Dokku -->
+            <section>
+                <h2>Dokku</h2>
+                <p>Self-hosted platform as a service</p>
+                <p>Your very own Heroku</p>
+            </section>
 
             <section>
                 <h2>What Dokku Does</h2>
@@ -103,12 +104,21 @@
             </section>
 
             <section>
-                <h3>Create an application.</h3>
+                <h3>Anatomy of the Server</h3>
-                <pre>
+                <ul>
-$ dokku apps:create chat.freedoom.party
+                    <li>Linode VPS</li>
------> Creating chat.freedoom.party...
+                    <li>Debian</li>
------> Creating new app virtual host file...
+                </ul>
-                </pre>
+            </section>
+
+            <section>
+                <h3>Anatomy of the Application</h3>
+                <ul>
+                    <li>Hono Web Server Application</li>
+                    <li>Mithril.js Frontend Application</li>
+                    <li>Dockerized</li>
+                </ul>
+            </section>
 
             <!-- Deployment Example -->