diff --git a/source/_local/blog-from-scratch/topology.drawio b/source/_local/blog-from-scratch/topology.drawio
index daa9a7d..9d7474c 100644
--- a/source/_local/blog-from-scratch/topology.drawio
+++ b/source/_local/blog-from-scratch/topology.drawio
@@ -1,156 +1,158 @@
 <mxfile host="65bd71144e" agent="Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Code/1.89.1 Chrome/120.0.6099.291 Electron/28.2.8 Safari/537.36" version="24.7.17">
     <diagram name="第 1 页" id="0IsGyt9-C6fUE3qf56MM">
-        <mxGraphModel dx="1734" dy="824" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="827" pageHeight="1169" math="0" shadow="0">
+        <mxGraphModel dx="1445" dy="687" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="827" pageHeight="1169" math="0" shadow="0">
             <root>
                 <mxCell id="0"/>
                 <mxCell id="1" parent="0"/>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-32" value="" style="rounded=1;whiteSpace=wrap;html=1;dashed=1;arcSize=5;fillOpacity=20;fillColor=#fff2cc;strokeColor=#d6b656;" parent="1" vertex="1">
-                    <mxGeometry x="480" y="80" width="240" height="300" as="geometry"/>
+                <mxCell id="2" value="" style="group" vertex="1" connectable="0" parent="1">
+                    <mxGeometry x="20" y="80" width="790" height="400" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-2" value="" style="rounded=1;whiteSpace=wrap;html=1;dashed=1;fillColor=#CCCCCC;strokeColor=#000000;arcSize=5;fillOpacity=20;" parent="1" vertex="1">
-                    <mxGeometry x="80" y="80" width="320" height="400" as="geometry"/>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-32" value="" style="rounded=1;whiteSpace=wrap;html=1;dashed=1;arcSize=5;fillOpacity=20;fillColor=#fff2cc;strokeColor=#d6b656;" parent="2" vertex="1">
+                    <mxGeometry x="550" width="240" height="300" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-5" value="Switch" style="rounded=1;whiteSpace=wrap;html=1;fillOpacity=100;arcSize=10;fillColor=#d5e8d4;strokeColor=#82b366;" parent="1" vertex="1">
-                    <mxGeometry x="120" y="200" width="240" height="40" as="geometry"/>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-2" value="" style="rounded=1;whiteSpace=wrap;html=1;dashed=1;fillColor=#CCCCCC;strokeColor=#000000;arcSize=5;fillOpacity=20;" parent="2" vertex="1">
+                    <mxGeometry width="360" height="400" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-6" value="China Unicom" style="rounded=1;whiteSpace=wrap;html=1;fillOpacity=100;arcSize=11;fillColor=none;" parent="1" vertex="1">
-                    <mxGeometry x="250" y="120" width="110" height="50" as="geometry"/>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-5" value="Switch" style="rounded=1;whiteSpace=wrap;html=1;fillOpacity=100;arcSize=10;fillColor=#d5e8d4;strokeColor=#82b366;" parent="2" vertex="1">
+                    <mxGeometry x="40" y="120" width="270" height="40" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-7" value="TP-Link BE7200" style="rounded=1;whiteSpace=wrap;html=1;fillOpacity=100;arcSize=11;fillColor=#dae8fc;strokeColor=#6c8ebf;" parent="1" vertex="1">
-                    <mxGeometry x="120" y="120" width="110" height="50" as="geometry"/>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-6" value="China Unicom" style="rounded=1;whiteSpace=wrap;html=1;fillOpacity=100;arcSize=11;fillColor=none;" parent="2" vertex="1">
+                    <mxGeometry x="200" y="40" width="110" height="50" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-9" value="" style="rounded=1;whiteSpace=wrap;html=1;fillOpacity=100;arcSize=5;imageHeight=24;fillColor=#ffe6cc;strokeColor=#d79b00;" parent="1" vertex="1">
-                    <mxGeometry x="120" y="270" width="110" height="170" as="geometry"/>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-7" value="TP-Link BE7200" style="rounded=1;whiteSpace=wrap;html=1;fillOpacity=100;arcSize=11;fillColor=#dae8fc;strokeColor=#6c8ebf;" parent="2" vertex="1">
+                    <mxGeometry x="40" y="40" width="110" height="50" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-13" value="" style="endArrow=none;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;entryX=0;entryY=0.5;entryDx=0;entryDy=0;strokeWidth=1;exitX=1;exitY=0.5;exitDx=0;exitDy=0;fillColor=#f8cecc;strokeColor=#b85450;" parent="1" source="BgsjVap7VQJG3c3frFS7-7" target="BgsjVap7VQJG3c3frFS7-6" edge="1">
+                <mxCell id="BgsjVap7VQJG3c3frFS7-9" value="" style="rounded=1;whiteSpace=wrap;html=1;fillOpacity=100;arcSize=5;imageHeight=24;fillColor=#ffe6cc;strokeColor=#d79b00;" parent="2" vertex="1">
+                    <mxGeometry x="40" y="190" width="110" height="170" as="geometry"/>
+                </mxCell>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-13" value="" style="endArrow=none;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;entryX=0;entryY=0.5;entryDx=0;entryDy=0;strokeWidth=1;exitX=1;exitY=0.5;exitDx=0;exitDy=0;fillColor=#f8cecc;strokeColor=#b85450;" parent="2" source="BgsjVap7VQJG3c3frFS7-7" target="BgsjVap7VQJG3c3frFS7-6" edge="1">
                     <mxGeometry width="50" height="50" relative="1" as="geometry">
-                        <mxPoint x="305" y="200" as="sourcePoint"/>
-                        <mxPoint x="305.00000000000006" y="170" as="targetPoint"/>
+                        <mxPoint x="225" y="120" as="sourcePoint"/>
+                        <mxPoint x="225.00000000000006" y="90" as="targetPoint"/>
                     </mxGeometry>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-14" value="" style="endArrow=none;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;entryX=0.5;entryY=1;entryDx=0;entryDy=0;strokeWidth=1;fillColor=#f8cecc;strokeColor=#b85450;" parent="1" edge="1">
+                <mxCell id="BgsjVap7VQJG3c3frFS7-14" value="" style="endArrow=none;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;entryX=0.5;entryY=1;entryDx=0;entryDy=0;strokeWidth=1;fillColor=#f8cecc;strokeColor=#b85450;" parent="2" edge="1">
                     <mxGeometry width="50" height="50" relative="1" as="geometry">
-                        <mxPoint x="174.83" y="200" as="sourcePoint"/>
-                        <mxPoint x="174.83000000000007" y="170" as="targetPoint"/>
+                        <mxPoint x="94.83000000000001" y="120" as="sourcePoint"/>
+                        <mxPoint x="94.83000000000007" y="90" as="targetPoint"/>
                     </mxGeometry>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-15" value="" style="endArrow=none;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;entryX=0.5;entryY=1;entryDx=0;entryDy=0;strokeWidth=1;" parent="1" edge="1">
+                <mxCell id="BgsjVap7VQJG3c3frFS7-15" value="" style="endArrow=none;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;entryX=0.5;entryY=1;entryDx=0;entryDy=0;strokeWidth=1;" parent="2" edge="1">
                     <mxGeometry width="50" height="50" relative="1" as="geometry">
-                        <mxPoint x="174.83" y="270" as="sourcePoint"/>
-                        <mxPoint x="174.83000000000007" y="240" as="targetPoint"/>
+                        <mxPoint x="94.83000000000001" y="190" as="sourcePoint"/>
+                        <mxPoint x="94.83000000000007" y="160" as="targetPoint"/>
                     </mxGeometry>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-16" value="" style="endArrow=none;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;entryX=0.5;entryY=1;entryDx=0;entryDy=0;strokeWidth=1;fillColor=#f8cecc;strokeColor=#b85450;" parent="1" edge="1">
+                <mxCell id="BgsjVap7VQJG3c3frFS7-16" value="" style="endArrow=none;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;entryX=0.5;entryY=1;entryDx=0;entryDy=0;strokeWidth=1;fillColor=#f8cecc;strokeColor=#b85450;" parent="2" edge="1">
                     <mxGeometry width="50" height="50" relative="1" as="geometry">
-                        <mxPoint x="304.83000000000004" y="270" as="sourcePoint"/>
-                        <mxPoint x="304.83000000000004" y="240" as="targetPoint"/>
+                        <mxPoint x="254.83000000000004" y="190" as="sourcePoint"/>
+                        <mxPoint x="254.83000000000004" y="160" as="targetPoint"/>
                     </mxGeometry>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-20" value="Qnap TS-551" style="text;html=1;align=center;verticalAlign=middle;whiteSpace=wrap;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;" parent="1" vertex="1">
-                    <mxGeometry x="132.5" y="280" width="85" height="30" as="geometry"/>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-20" value="Qnap TS-551" style="text;html=1;align=center;verticalAlign=middle;whiteSpace=wrap;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;" parent="2" vertex="1">
+                    <mxGeometry x="52.5" y="200" width="85" height="30" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-21" value="gitea" style="rounded=1;whiteSpace=wrap;html=1;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;glass=0;shadow=0;fillColor=#f8cecc;strokeColor=#b85450;strokeWidth=1;" parent="1" vertex="1">
-                    <mxGeometry x="130" y="330" width="90" height="30" as="geometry"/>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-21" value="gitea" style="rounded=1;whiteSpace=wrap;html=1;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;glass=0;shadow=0;fillColor=#f8cecc;strokeColor=#b85450;strokeWidth=1;" parent="2" vertex="1">
+                    <mxGeometry x="50" y="250" width="90" height="30" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-22" value="nginx" style="rounded=1;whiteSpace=wrap;html=1;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;glass=0;shadow=0;fillColor=#f8cecc;strokeColor=#b85450;strokeWidth=1;" parent="1" vertex="1">
-                    <mxGeometry x="130" y="386" width="90" height="30" as="geometry"/>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-22" value="nginx" style="rounded=1;whiteSpace=wrap;html=1;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;glass=0;shadow=0;fillColor=#f8cecc;strokeColor=#b85450;strokeWidth=1;" parent="2" vertex="1">
+                    <mxGeometry x="50" y="306" width="90" height="30" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-23" value="" style="rounded=1;whiteSpace=wrap;html=1;fillOpacity=100;arcSize=5;imageHeight=24;fillColor=#ffe6cc;strokeColor=#d79b00;" parent="1" vertex="1">
-                    <mxGeometry x="250" y="270" width="110" height="170" as="geometry"/>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-23" value="" style="rounded=1;whiteSpace=wrap;html=1;fillOpacity=100;arcSize=5;imageHeight=24;fillColor=#ffe6cc;strokeColor=#d79b00;" parent="2" vertex="1">
+                    <mxGeometry x="200" y="190" width="110" height="170" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-24" value="Caddy" style="rounded=1;whiteSpace=wrap;html=1;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;glass=0;shadow=0;fillColor=#f8cecc;strokeColor=#b85450;strokeWidth=1;" parent="1" vertex="1">
-                    <mxGeometry x="260" y="316" width="90" height="30" as="geometry"/>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-24" value="Caddy" style="rounded=1;whiteSpace=wrap;html=1;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;glass=0;shadow=0;fillColor=#f8cecc;strokeColor=#b85450;strokeWidth=1;" parent="2" vertex="1">
+                    <mxGeometry x="210" y="236" width="90" height="30" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-25" value="MacMini M2" style="text;html=1;align=center;verticalAlign=middle;whiteSpace=wrap;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;" parent="1" vertex="1">
-                    <mxGeometry x="262.5" y="280" width="85" height="30" as="geometry"/>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-25" value="MacMini M2" style="text;html=1;align=center;verticalAlign=middle;whiteSpace=wrap;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;" parent="2" vertex="1">
+                    <mxGeometry x="212.5" y="200" width="85" height="30" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-26" value="ddns-go" style="rounded=1;whiteSpace=wrap;html=1;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;glass=0;shadow=0;fillColor=#f8cecc;strokeColor=#b85450;strokeWidth=1;" parent="1" vertex="1">
-                    <mxGeometry x="260" y="356" width="90" height="30" as="geometry"/>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-26" value="ddns-go" style="rounded=1;whiteSpace=wrap;html=1;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;glass=0;shadow=0;fillColor=#f8cecc;strokeColor=#b85450;strokeWidth=1;" parent="2" vertex="1">
+                    <mxGeometry x="210" y="276" width="90" height="30" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-27" value="gitea-runner" style="rounded=1;whiteSpace=wrap;html=1;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;glass=0;shadow=0;fillColor=#f8cecc;strokeColor=#b85450;strokeWidth=1;" parent="1" vertex="1">
-                    <mxGeometry x="260" y="396" width="90" height="30" as="geometry"/>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-27" value="gitea-runner" style="rounded=1;whiteSpace=wrap;html=1;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;glass=0;shadow=0;fillColor=#f8cecc;strokeColor=#b85450;strokeWidth=1;" parent="2" vertex="1">
+                    <mxGeometry x="210" y="316" width="90" height="30" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-29" value="" style="curved=1;endArrow=openThin;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;exitX=0;exitY=0.5;exitDx=0;exitDy=0;entryX=1;entryY=0.5;entryDx=0;entryDy=0;endFill=0;dashed=1;fillColor=#f8cecc;strokeColor=#b85450;" parent="1" source="BgsjVap7VQJG3c3frFS7-24" target="BgsjVap7VQJG3c3frFS7-21" edge="1">
+                <mxCell id="BgsjVap7VQJG3c3frFS7-29" value="" style="curved=1;endArrow=openThin;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;exitX=0;exitY=0.5;exitDx=0;exitDy=0;entryX=1;entryY=0.5;entryDx=0;entryDy=0;endFill=0;dashed=1;fillColor=#f8cecc;strokeColor=#b85450;" parent="2" source="BgsjVap7VQJG3c3frFS7-24" target="BgsjVap7VQJG3c3frFS7-21" edge="1">
                     <mxGeometry width="50" height="50" relative="1" as="geometry">
-                        <mxPoint x="160" y="320" as="sourcePoint"/>
-                        <mxPoint x="210" y="270" as="targetPoint"/>
+                        <mxPoint x="80" y="240" as="sourcePoint"/>
+                        <mxPoint x="130" y="190" as="targetPoint"/>
                         <Array as="points">
-                            <mxPoint x="243" y="331"/>
-                            <mxPoint x="243" y="340"/>
-                            <mxPoint x="240" y="347"/>
+                            <mxPoint x="183" y="250"/>
+                            <mxPoint x="167" y="267"/>
                         </Array>
                     </mxGeometry>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-30" value="Cloudflare DNS" style="rounded=1;whiteSpace=wrap;html=1;strokeColor=#d79b00;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;fillColor=#ffe6cc;arcSize=11;" parent="1" vertex="1">
-                    <mxGeometry x="520" y="280" width="160" height="50" as="geometry"/>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-30" value="Cloudflare DNS" style="rounded=1;whiteSpace=wrap;html=1;strokeColor=#d79b00;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;fillColor=#ffe6cc;arcSize=11;" parent="2" vertex="1">
+                    <mxGeometry x="590" y="200" width="160" height="50" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-31" value="Cloudflare Proxy" style="rounded=1;whiteSpace=wrap;html=1;strokeColor=#6c8ebf;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;fillColor=#dae8fc;arcSize=11;" parent="1" vertex="1">
-                    <mxGeometry x="520" y="200" width="160" height="50" as="geometry"/>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-31" value="Cloudflare Proxy" style="rounded=1;whiteSpace=wrap;html=1;strokeColor=#6c8ebf;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;fillColor=#dae8fc;arcSize=11;" parent="2" vertex="1">
+                    <mxGeometry x="590" y="120" width="160" height="50" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-33" value="Cloudflare Cache" style="rounded=1;whiteSpace=wrap;html=1;strokeColor=default;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;fontColor=default;fillColor=none;arcSize=11;" parent="1" vertex="1">
-                    <mxGeometry x="520" y="120" width="160" height="50" as="geometry"/>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-33" value="Cloudflare Cache" style="rounded=1;whiteSpace=wrap;html=1;strokeColor=default;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;fontColor=default;fillColor=none;arcSize=11;" parent="2" vertex="1">
+                    <mxGeometry x="590" y="40" width="160" height="50" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-34" value="" style="endArrow=none;dashed=1;html=1;strokeWidth=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;entryX=0.5;entryY=0;entryDx=0;entryDy=0;exitX=0.5;exitY=1;exitDx=0;exitDy=0;" parent="1" source="BgsjVap7VQJG3c3frFS7-33" target="BgsjVap7VQJG3c3frFS7-31" edge="1">
+                <mxCell id="BgsjVap7VQJG3c3frFS7-34" value="" style="endArrow=none;dashed=1;html=1;strokeWidth=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;entryX=0.5;entryY=0;entryDx=0;entryDy=0;exitX=0.5;exitY=1;exitDx=0;exitDy=0;" parent="2" source="BgsjVap7VQJG3c3frFS7-33" target="BgsjVap7VQJG3c3frFS7-31" edge="1">
                     <mxGeometry width="50" height="50" relative="1" as="geometry">
-                        <mxPoint x="490" y="320" as="sourcePoint"/>
-                        <mxPoint x="540" y="270" as="targetPoint"/>
+                        <mxPoint x="560" y="240" as="sourcePoint"/>
+                        <mxPoint x="610" y="190" as="targetPoint"/>
                     </mxGeometry>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-35" value="" style="endArrow=openThin;startArrow=openThin;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;exitX=1;exitY=0.5;exitDx=0;exitDy=0;entryX=0;entryY=0.5;entryDx=0;entryDy=0;startFill=0;endFill=0;fillColor=#f8cecc;strokeColor=#b85450;dashed=1;" parent="1" source="BgsjVap7VQJG3c3frFS7-6" target="BgsjVap7VQJG3c3frFS7-33" edge="1">
+                <mxCell id="BgsjVap7VQJG3c3frFS7-35" value="" style="endArrow=openThin;startArrow=openThin;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;exitX=1;exitY=0.5;exitDx=0;exitDy=0;entryX=0;entryY=0.5;entryDx=0;entryDy=0;startFill=0;endFill=0;fillColor=#f8cecc;strokeColor=#b85450;dashed=1;" parent="2" source="BgsjVap7VQJG3c3frFS7-6" target="BgsjVap7VQJG3c3frFS7-33" edge="1">
                     <mxGeometry width="50" height="50" relative="1" as="geometry">
-                        <mxPoint x="374" y="144.76" as="sourcePoint"/>
-                        <mxPoint x="454" y="144.76" as="targetPoint"/>
+                        <mxPoint x="354" y="64.75999999999999" as="sourcePoint"/>
+                        <mxPoint x="434" y="64.75999999999999" as="targetPoint"/>
                     </mxGeometry>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-39" value="" style="curved=1;endArrow=openThin;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;exitX=1;exitY=0.5;exitDx=0;exitDy=0;entryX=0;entryY=0.5;entryDx=0;entryDy=0;startArrow=openThin;startFill=0;endFill=0;fillColor=#f8cecc;strokeColor=#b85450;" parent="1" source="BgsjVap7VQJG3c3frFS7-6" target="BgsjVap7VQJG3c3frFS7-31" edge="1">
+                <mxCell id="BgsjVap7VQJG3c3frFS7-39" value="" style="curved=1;endArrow=openThin;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;exitX=1;exitY=0.5;exitDx=0;exitDy=0;entryX=0;entryY=0.5;entryDx=0;entryDy=0;startArrow=openThin;startFill=0;endFill=0;fillColor=#f8cecc;strokeColor=#b85450;" parent="2" source="BgsjVap7VQJG3c3frFS7-6" target="BgsjVap7VQJG3c3frFS7-31" edge="1">
                     <mxGeometry width="50" height="50" relative="1" as="geometry">
-                        <mxPoint x="420" y="180" as="sourcePoint"/>
-                        <mxPoint x="540" y="270" as="targetPoint"/>
+                        <mxPoint x="400" y="100" as="sourcePoint"/>
+                        <mxPoint x="520" y="190" as="targetPoint"/>
                         <Array as="points">
-                            <mxPoint x="410" y="145"/>
-                            <mxPoint x="460" y="230"/>
+                            <mxPoint x="390" y="65"/>
+                            <mxPoint x="440" y="150"/>
                         </Array>
                     </mxGeometry>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-41" value="" style="endArrow=none;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;entryX=0.5;entryY=1;entryDx=0;entryDy=0;strokeWidth=1;fillColor=#f8cecc;strokeColor=#b85450;exitX=0.5;exitY=0;exitDx=0;exitDy=0;" parent="1" source="BgsjVap7VQJG3c3frFS7-30" target="BgsjVap7VQJG3c3frFS7-31" edge="1">
+                <mxCell id="BgsjVap7VQJG3c3frFS7-41" value="" style="endArrow=none;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;entryX=0.5;entryY=1;entryDx=0;entryDy=0;strokeWidth=1;fillColor=#f8cecc;strokeColor=#b85450;exitX=0.5;exitY=0;exitDx=0;exitDy=0;" parent="2" source="BgsjVap7VQJG3c3frFS7-30" target="BgsjVap7VQJG3c3frFS7-31" edge="1">
                     <mxGeometry width="50" height="50" relative="1" as="geometry">
-                        <mxPoint x="600" y="280" as="sourcePoint"/>
-                        <mxPoint x="600" y="250" as="targetPoint"/>
+                        <mxPoint x="670" y="200" as="sourcePoint"/>
+                        <mxPoint x="670" y="170" as="targetPoint"/>
                     </mxGeometry>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-42" value="" style="endArrow=openThin;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;entryX=0.5;entryY=1;entryDx=0;entryDy=0;exitX=0.5;exitY=0;exitDx=0;exitDy=0;fillColor=#f8cecc;strokeColor=#b85450;endFill=0;startArrow=openThin;startFill=0;" parent="1" source="BgsjVap7VQJG3c3frFS7-43" target="BgsjVap7VQJG3c3frFS7-30" edge="1">
+                <mxCell id="BgsjVap7VQJG3c3frFS7-42" value="" style="endArrow=openThin;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;entryX=0.5;entryY=1;entryDx=0;entryDy=0;exitX=0.5;exitY=0;exitDx=0;exitDy=0;fillColor=#f8cecc;strokeColor=#b85450;endFill=0;startArrow=openThin;startFill=0;" parent="2" source="BgsjVap7VQJG3c3frFS7-43" target="BgsjVap7VQJG3c3frFS7-30" edge="1">
                     <mxGeometry width="50" height="50" relative="1" as="geometry">
-                        <mxPoint x="600" y="400" as="sourcePoint"/>
-                        <mxPoint x="540" y="370" as="targetPoint"/>
+                        <mxPoint x="670" y="320" as="sourcePoint"/>
+                        <mxPoint x="610" y="290" as="targetPoint"/>
                     </mxGeometry>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-43" value="Users" style="rounded=1;whiteSpace=wrap;html=1;strokeColor=#82b366;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;fillColor=#d5e8d4;arcSize=11;dashed=1;fillOpacity=20;" parent="1" vertex="1">
-                    <mxGeometry x="480" y="430" width="240" height="50" as="geometry"/>
+                <mxCell id="BgsjVap7VQJG3c3frFS7-43" value="Users" style="rounded=1;whiteSpace=wrap;html=1;strokeColor=#82b366;align=center;verticalAlign=middle;fontFamily=Helvetica;fontSize=12;fillColor=#d5e8d4;arcSize=11;dashed=1;fillOpacity=20;" parent="2" vertex="1">
+                    <mxGeometry x="550" y="350" width="240" height="50" as="geometry"/>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-44" value="" style="curved=1;endArrow=openThin;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;exitX=1;exitY=0.5;exitDx=0;exitDy=0;entryX=0;entryY=0.5;entryDx=0;entryDy=0;startArrow=none;startFill=0;endFill=0;fillColor=#dae8fc;strokeColor=#6c8ebf;dashed=1;" parent="1" source="BgsjVap7VQJG3c3frFS7-26" target="BgsjVap7VQJG3c3frFS7-30" edge="1">
+                <mxCell id="BgsjVap7VQJG3c3frFS7-44" value="" style="curved=1;endArrow=openThin;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;exitX=1;exitY=0.5;exitDx=0;exitDy=0;entryX=0;entryY=0.5;entryDx=0;entryDy=0;startArrow=none;startFill=0;endFill=0;fillColor=#dae8fc;strokeColor=#6c8ebf;dashed=1;" parent="2" source="BgsjVap7VQJG3c3frFS7-26" target="BgsjVap7VQJG3c3frFS7-30" edge="1">
                     <mxGeometry width="50" height="50" relative="1" as="geometry">
-                        <mxPoint x="360" y="270" as="sourcePoint"/>
-                        <mxPoint x="520" y="350" as="targetPoint"/>
+                        <mxPoint x="340" y="190" as="sourcePoint"/>
+                        <mxPoint x="500" y="270" as="targetPoint"/>
                         <Array as="points">
-                            <mxPoint x="440" y="370"/>
-                            <mxPoint x="440" y="310"/>
+                            <mxPoint x="420" y="290"/>
+                            <mxPoint x="420" y="230"/>
                         </Array>
                     </mxGeometry>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-45" value="" style="curved=1;endArrow=openThin;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;exitX=0;exitY=0.5;exitDx=0;exitDy=0;entryX=0.5;entryY=1;entryDx=0;entryDy=0;endFill=0;fillColor=#e1d5e7;strokeColor=#9673a6;" parent="1" source="BgsjVap7VQJG3c3frFS7-43" target="BgsjVap7VQJG3c3frFS7-22" edge="1">
+                <mxCell id="BgsjVap7VQJG3c3frFS7-45" value="" style="curved=1;endArrow=openThin;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;exitX=0;exitY=0.5;exitDx=0;exitDy=0;entryX=0.5;entryY=1;entryDx=0;entryDy=0;endFill=0;fillColor=#e1d5e7;strokeColor=#9673a6;" parent="2" source="BgsjVap7VQJG3c3frFS7-43" target="BgsjVap7VQJG3c3frFS7-22" edge="1">
                     <mxGeometry width="50" height="50" relative="1" as="geometry">
-                        <mxPoint x="270" y="341" as="sourcePoint"/>
-                        <mxPoint x="230" y="355" as="targetPoint"/>
+                        <mxPoint x="250" y="261" as="sourcePoint"/>
+                        <mxPoint x="210" y="275" as="targetPoint"/>
                         <Array as="points">
-                            <mxPoint x="380" y="460"/>
-                            <mxPoint x="200" y="450"/>
+                            <mxPoint x="360" y="380"/>
+                            <mxPoint x="180" y="370"/>
                         </Array>
                     </mxGeometry>
                 </mxCell>
-                <mxCell id="BgsjVap7VQJG3c3frFS7-46" value="" style="curved=1;endArrow=openThin;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;exitX=0.5;exitY=0;exitDx=0;exitDy=0;entryX=0.5;entryY=1;entryDx=0;entryDy=0;endFill=0;dashed=1;fillColor=#e1d5e7;strokeColor=#9673a6;" parent="1" source="BgsjVap7VQJG3c3frFS7-22" target="BgsjVap7VQJG3c3frFS7-21" edge="1">
+                <mxCell id="BgsjVap7VQJG3c3frFS7-46" value="" style="curved=1;endArrow=openThin;html=1;rounded=0;fontFamily=Helvetica;fontSize=12;fontColor=default;exitX=0.5;exitY=0;exitDx=0;exitDy=0;entryX=0.5;entryY=1;entryDx=0;entryDy=0;endFill=0;dashed=1;fillColor=#e1d5e7;strokeColor=#9673a6;" parent="2" source="BgsjVap7VQJG3c3frFS7-22" target="BgsjVap7VQJG3c3frFS7-21" edge="1">
                     <mxGeometry width="50" height="50" relative="1" as="geometry">
-                        <mxPoint x="270" y="341" as="sourcePoint"/>
-                        <mxPoint x="230" y="355" as="targetPoint"/>
+                        <mxPoint x="190" y="261" as="sourcePoint"/>
+                        <mxPoint x="150" y="275" as="targetPoint"/>
                         <Array as="points"/>
                     </mxGeometry>
                 </mxCell>
diff --git a/source/img/blog-from-scratch/blog_topology.png b/source/img/blog-from-scratch/blog_topology.png
index b0e4e78..5c1f94b 100644
Binary files a/source/img/blog-from-scratch/blog_topology.png and b/source/img/blog-from-scratch/blog_topology.png differ