<mxfile host="app.diagrams.net" agent="hernan.tech" version="24.0.0">
  <diagram id="behind-the-blog-arch" name="Architecture">
    <mxGraphModel dx="960" dy="720" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="850" pageHeight="1100" math="0" shadow="0">
      <root>
        <mxCell id="0" />
        <mxCell id="1" parent="0" />

        <mxCell id="title" value="How this blog gets from text to the web" style="text;html=1;align=center;fontSize=18;fontStyle=1;fontColor=#1d1d1f;" vertex="1" parent="1">
          <mxGeometry x="160" y="20" width="540" height="30" as="geometry" />
        </mxCell>

        <mxCell id="n1" value="1 · You write — Markdown&#10;src/data/blog/*.md · projects/*.md&#10;title, description, date &amp; tags in frontmatter" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#f5f5f7;strokeColor=#d2d2d7;fontColor=#1d1d1f;fontSize=13;align=left;spacingLeft=14;verticalAlign=middle;arcSize=14;" vertex="1" parent="1">
          <mxGeometry x="160" y="70" width="540" height="70" as="geometry" />
        </mxCell>

        <mxCell id="n2" value="2 · Astro builds the site (static)&#10;Content Collections + Zod validate every file&#10;Pages · Layouts · Components · i18n (EN at / · ES at /es)&#10;MDX · Shiki highlight · + Pagefind search · + OG images · + RSS · + Sitemap" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#f5f5f7;strokeColor=#d2d2d7;fontColor=#1d1d1f;fontSize=13;align=left;spacingLeft=14;verticalAlign=middle;arcSize=10;" vertex="1" parent="1">
          <mxGeometry x="160" y="170" width="540" height="120" as="geometry" />
        </mxCell>

        <mxCell id="n3" value="3 · Output — dist/&#10;Plain static HTML + CSS + minimal JS. No server, no database." style="rounded=1;whiteSpace=wrap;html=1;fillColor=#f5f5f7;strokeColor=#d2d2d7;fontColor=#1d1d1f;fontSize=13;align=left;spacingLeft=14;verticalAlign=middle;arcSize=16;" vertex="1" parent="1">
          <mxGeometry x="160" y="320" width="540" height="64" as="geometry" />
        </mxCell>

        <mxCell id="n4" value="4 · git push → GitHub&#10;Your content lives in version control — every change is tracked." style="rounded=1;whiteSpace=wrap;html=1;fillColor=#f5f5f7;strokeColor=#d2d2d7;fontColor=#1d1d1f;fontSize=13;align=left;spacingLeft=14;verticalAlign=middle;arcSize=16;" vertex="1" parent="1">
          <mxGeometry x="160" y="414" width="540" height="64" as="geometry" />
        </mxCell>

        <mxCell id="n5" value="5 · Cloudflare Pages (the infra you don't manage)&#10;Runs npm run build automatically on every push&#10;Serves dist/ from a global CDN · free automatic HTTPS&#10;_headers · _redirects · a preview URL for every branch · scales to zero cost" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#eaf2fd;strokeColor=#0071e3;strokeWidth=2;fontColor=#1d1d1f;fontSize=13;align=left;spacingLeft=14;verticalAlign=middle;arcSize=10;" vertex="1" parent="1">
          <mxGeometry x="160" y="508" width="540" height="120" as="geometry" />
        </mxCell>

        <mxCell id="n6" value="6 · hernan.tech&#10;Custom domain · DNS + automatic TLS · readers worldwide" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#0071e3;strokeColor=none;fontColor=#ffffff;fontSize=13;fontStyle=1;align=left;spacingLeft=14;verticalAlign=middle;arcSize=18;" vertex="1" parent="1">
          <mxGeometry x="160" y="658" width="540" height="58" as="geometry" />
        </mxCell>

        <mxCell id="e1" style="edgeStyle=orthogonalEdgeStyle;rounded=0;html=1;endArrow=block;strokeColor=#86868b;strokeWidth=1.5;" edge="1" parent="1" source="n1" target="n2"><mxGeometry relative="1" as="geometry" /></mxCell>
        <mxCell id="e2" style="edgeStyle=orthogonalEdgeStyle;rounded=0;html=1;endArrow=block;strokeColor=#86868b;strokeWidth=1.5;" edge="1" parent="1" source="n2" target="n3"><mxGeometry relative="1" as="geometry" /></mxCell>
        <mxCell id="e3" style="edgeStyle=orthogonalEdgeStyle;rounded=0;html=1;endArrow=block;strokeColor=#86868b;strokeWidth=1.5;" edge="1" parent="1" source="n3" target="n4"><mxGeometry relative="1" as="geometry" /></mxCell>
        <mxCell id="e4" style="edgeStyle=orthogonalEdgeStyle;rounded=0;html=1;endArrow=block;strokeColor=#86868b;strokeWidth=1.5;" edge="1" parent="1" source="n4" target="n5"><mxGeometry relative="1" as="geometry" /></mxCell>
        <mxCell id="e5" style="edgeStyle=orthogonalEdgeStyle;rounded=0;html=1;endArrow=block;strokeColor=#86868b;strokeWidth=1.5;" edge="1" parent="1" source="n5" target="n6"><mxGeometry relative="1" as="geometry" /></mxCell>
      </root>
    </mxGraphModel>
  </diagram>
</mxfile>
