Update site from docs source repo

Author: Exploding Labs Bot

superstack/assets/extra.css

@@ -38,7 +38,12 @@
   }
 
   /* Change header fonts */
-  h1, h2, h3, h4, h5, h6 {
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
     font-weight: 700;
     font-style: normal;
     letter-spacing: -0.5px;
@@ -59,13 +64,17 @@
     font-size: 0.9rem;
   }
 
-  p, ul, ol, pre {
+  p,
+  ul,
+  ol,
+  pre {
     font-size: 17px;
     margin-top: 1em;
     margin-bottom: 1em;
   }
 
-  ul, ol {
+  ul,
+  ol {
     margin-left: 3rem;
     padding-left: 3rem;
   }
@@ -103,4 +112,3 @@
 article {
   padding-bottom: 3rem;
 }
-

superstack/bluegreen/index.html

@@ -76,7 +76,7 @@
     <div data-md-component="skip">
 
 
-        <a href="#1-caddy" class="md-skip">
+        <a href="#1-create-a-docker-network" class="md-skip">
           Skip to content
         </a>
 
@@ -444,19 +444,28 @@
     <ul class="md-nav__list" data-md-component="toc" data-md-scrollfix>
 
         <li class="md-nav__item">
-  <a href="#1-caddy" class="md-nav__link">
+  <a href="#1-create-a-docker-network" class="md-nav__link">
     <span class="md-ellipsis">
-      1. Caddy
+      1. Create a Docker Network
     </span>
   </a>
 
-    <nav class="md-nav" aria-label="1. Caddy">
+</li>
+      
+        <li class="md-nav__item">
+  <a href="#2-adjust-caddy" class="md-nav__link">
+    <span class="md-ellipsis">
+      2. Adjust Caddy
+    </span>
+  </a>
+  
+    <nav class="md-nav" aria-label="2. Adjust Caddy">
       <ul class="md-nav__list">
 
           <li class="md-nav__item">
-  <a href="#set-the-caddy-container-name-explicitly" class="md-nav__link">
+  <a href="#name-the-caddy-containers" class="md-nav__link">
     <span class="md-ellipsis">
-      Set the Caddy container name explicitly
+      Name the Caddy containers
     </span>
   </a>
 
@@ -603,19 +612,28 @@
     <ul class="md-nav__list" data-md-component="toc" data-md-scrollfix>
 
         <li class="md-nav__item">
-  <a href="#1-caddy" class="md-nav__link">
+  <a href="#1-create-a-docker-network" class="md-nav__link">
+    <span class="md-ellipsis">
+      1. Create a Docker Network
+    </span>
+  </a>
+  
+</li>
+      
+        <li class="md-nav__item">
+  <a href="#2-adjust-caddy" class="md-nav__link">
     <span class="md-ellipsis">
-      1. Caddy
+      2. Adjust Caddy
     </span>
   </a>
 
-    <nav class="md-nav" aria-label="1. Caddy">
+    <nav class="md-nav" aria-label="2. Adjust Caddy">
       <ul class="md-nav__list">
 
           <li class="md-nav__item">
-  <a href="#set-the-caddy-container-name-explicitly" class="md-nav__link">
+  <a href="#name-the-caddy-containers" class="md-nav__link">
     <span class="md-ellipsis">
-      Set the Caddy container name explicitly
+      Name the Caddy containers
     </span>
   </a>
 
@@ -732,16 +750,35 @@ <h1>Blue/Green Deployments</h1>
 deploy to the idle stack, test it, and when ready, swap roles — giving
 near-zero downtime and easy rollback.</p>
 <p><img alt="Blue/Green" src="../assets/bluegreen.png" /></p>
-<h2 id="1-caddy">1. Caddy</h2>
-<h3 id="set-the-caddy-container-name-explicitly">Set the Caddy container name explicitly</h3>
-<p>This allows us to switch between the two stacks:</p>
+<h2 id="1-create-a-docker-network">1. Create a Docker Network</h2>
+<p>Blue/Green adds some complexity because where before there was just "the
+stack", now you have:</p>
+<ol>
+<li>A <code>blue</code> stack</li>
+<li>A <code>green</code> stack</li>
+<li>A front proxy to direct traffic</li>
+<li>An external Postgres.</li>
+</ol>
+<p>Create a network to link them:</p>
+<div class="highlight"><pre><span></span><code>docker<span class="w"> </span>network<span class="w"> </span>create<span class="w"> </span>app
+</code></pre></div>
+<p>And add it to the Compose file:</p>
+<div class="highlight"><span class="filename">compose.yaml</span><pre><span></span><code><span class="nt">networks</span><span class="p">:</span>
+<span class="w">  </span><span class="nt">default</span><span class="p">:</span>
+<span class="w">    </span><span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l l-Scalar l-Scalar-Plain">app</span>
+<span class="w">    </span><span class="nt">external</span><span class="p">:</span><span class="w"> </span><span class="l l-Scalar l-Scalar-Plain">true</span>
+</code></pre></div>
+<h2 id="2-adjust-caddy">2. Adjust Caddy</h2>
+<h3 id="name-the-caddy-containers">Name the Caddy containers</h3>
+<p>Naming the Caddy containers <code>blue_caddy</code> and <code>green_caddy</code> allows the front
+proxy to direct traffic to the correct stacks:</p>
 <div class="highlight"><span class="filename">compose.yaml</span><pre><span></span><code><span class="nt">caddy</span><span class="p">:</span>
 <span class="w">  </span><span class="nt">container_name</span><span class="p">:</span><span class="w"> </span><span class="l l-Scalar l-Scalar-Plain">${STACK_NAME}_caddy</span>
 </code></pre></div>
 <h3 id="remove-exposed-ports">Remove exposed ports</h3>
-<p>Remove the <code>caddy</code> service's <code>ports:</code> section in <code>compose.yaml</code>.</p>
-<p>We'll no longer expose ports in the stacks, instead a simple "front proxy" will
-sit in front of the two stacks, proxying to the active stack.</p>
+<p>We'll no longer expose ports in the stacks, instead a front proxy will sit in
+front of the two stacks, proxying to them.</p>
+<p>So remove the <code>caddy</code> service's <code>ports:</code> section in <code>compose.yaml</code>.</p>
 <h3 id="serve-http-only-in-the-stacks">Serve HTTP-only in the stacks</h3>
 <p>Set <code>CADDY_SITE_ADDRESS</code> to only <code>:80</code>, removing <code>:443</code> (leaving TLS
 termination to the front proxy):</p>
@@ -771,7 +808,7 @@ <h2 id="4-bring-up-two-stacks">4. Bring up two Stacks</h2>
 <p>Shell into the server and bring up the idle stack:</p>
 <div class="highlight"><pre><span></span><code><span class="nb">cd</span><span class="w"> </span>green
 docker<span class="w"> </span>compose<span class="w"> </span>pull
-docker<span class="w"> </span>compose<span class="w"> </span>up<span class="w"> </span>-d
+<span class="nv">STACK_NAME</span><span class="o">=</span>green<span class="w"> </span>docker<span class="w"> </span>compose<span class="w"> </span>up<span class="w"> </span>-d
 </code></pre></div>
 <p>Docker will use the directory name <code>green</code> as the project name, creating
 different containers, volumes and networks than the <code>blue</code> stack.</p>