Personalize portfolio and add technical case studies
This commit is contained in:
@@ -0,0 +1,105 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1180 660" role="img" aria-labelledby="title desc">
|
||||
<title id="title">Portfolio GitOps architecture</title>
|
||||
<desc id="desc">A Git repository flows through Argo CD and Kustomize into a restricted Kubernetes namespace, then through ingress and TLS to the browser. Security and observability controls surround the workload.</desc>
|
||||
<defs>
|
||||
<linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
|
||||
<stop offset="0" stop-color="#0f253d"/>
|
||||
<stop offset="1" stop-color="#081522"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="accent" x1="0" y1="0" x2="1" y2="0">
|
||||
<stop offset="0" stop-color="#65d4ff"/>
|
||||
<stop offset="1" stop-color="#79f2c0"/>
|
||||
</linearGradient>
|
||||
<filter id="shadow" x="-20%" y="-20%" width="140%" height="140%">
|
||||
<feDropShadow dx="0" dy="12" stdDeviation="16" flood-color="#000" flood-opacity=".28"/>
|
||||
</filter>
|
||||
<marker id="arrow" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="7" markerHeight="7" orient="auto-start-reverse">
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#65d4ff"/>
|
||||
</marker>
|
||||
</defs>
|
||||
|
||||
<rect width="1180" height="660" rx="30" fill="url(#bg)"/>
|
||||
<rect x="1" y="1" width="1178" height="658" rx="29" fill="none" stroke="#29445e"/>
|
||||
|
||||
<text x="60" y="68" fill="#eef7ff" font-family="Arial, sans-serif" font-size="30" font-weight="700">GitOps delivery path</text>
|
||||
<text x="60" y="102" fill="#a7bed2" font-family="Arial, sans-serif" font-size="17">The site architecture is part of the demonstration.</text>
|
||||
|
||||
<g filter="url(#shadow)" font-family="Arial, sans-serif">
|
||||
<g transform="translate(55 180)">
|
||||
<rect width="180" height="120" rx="20" fill="#102b45" stroke="#31506c"/>
|
||||
<text x="90" y="48" text-anchor="middle" fill="#79f2c0" font-size="17" font-weight="700">Git repository</text>
|
||||
<text x="90" y="76" text-anchor="middle" fill="#a7bed2" font-size="14">Desired state</text>
|
||||
<text x="90" y="97" text-anchor="middle" fill="#a7bed2" font-size="14">Reviewable changes</text>
|
||||
</g>
|
||||
|
||||
<g transform="translate(285 180)">
|
||||
<rect width="180" height="120" rx="20" fill="#102b45" stroke="#31506c"/>
|
||||
<text x="90" y="48" text-anchor="middle" fill="#65d4ff" font-size="17" font-weight="700">Argo CD</text>
|
||||
<text x="90" y="76" text-anchor="middle" fill="#a7bed2" font-size="14">Reconciliation</text>
|
||||
<text x="90" y="97" text-anchor="middle" fill="#a7bed2" font-size="14">Self-healing</text>
|
||||
</g>
|
||||
|
||||
<g transform="translate(515 180)">
|
||||
<rect width="180" height="120" rx="20" fill="#102b45" stroke="#31506c"/>
|
||||
<text x="90" y="48" text-anchor="middle" fill="#79f2c0" font-size="17" font-weight="700">Kustomize</text>
|
||||
<text x="90" y="76" text-anchor="middle" fill="#a7bed2" font-size="14">Manifest rendering</text>
|
||||
<text x="90" y="97" text-anchor="middle" fill="#a7bed2" font-size="14">ConfigMap hashes</text>
|
||||
</g>
|
||||
|
||||
<g transform="translate(745 160)">
|
||||
<rect width="200" height="160" rx="22" fill="#102b45" stroke="#4f7899"/>
|
||||
<text x="100" y="42" text-anchor="middle" fill="#65d4ff" font-size="17" font-weight="700">Kubernetes namespace</text>
|
||||
<text x="100" y="72" text-anchor="middle" fill="#eef7ff" font-size="16">2 web replicas</text>
|
||||
<text x="100" y="98" text-anchor="middle" fill="#a7bed2" font-size="14">Non-root · read-only</text>
|
||||
<text x="100" y="121" text-anchor="middle" fill="#a7bed2" font-size="14">No API token</text>
|
||||
<text x="100" y="144" text-anchor="middle" fill="#a7bed2" font-size="14">Default-deny network</text>
|
||||
</g>
|
||||
|
||||
<g transform="translate(995 180)">
|
||||
<rect width="130" height="120" rx="20" fill="#102b45" stroke="#31506c"/>
|
||||
<text x="65" y="44" text-anchor="middle" fill="#79f2c0" font-size="17" font-weight="700">Browser</text>
|
||||
<text x="65" y="73" text-anchor="middle" fill="#a7bed2" font-size="14">NGINX ingress</text>
|
||||
<text x="65" y="96" text-anchor="middle" fill="#a7bed2" font-size="14">TLS</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g stroke="#65d4ff" stroke-width="3" fill="none" marker-end="url(#arrow)">
|
||||
<path d="M235 240 H275"/>
|
||||
<path d="M465 240 H505"/>
|
||||
<path d="M695 240 H735"/>
|
||||
<path d="M945 240 H985"/>
|
||||
</g>
|
||||
|
||||
<g font-family="Arial, sans-serif">
|
||||
<rect x="55" y="390" width="1070" height="190" rx="24" fill="#0a1a2a" stroke="#29445e"/>
|
||||
<text x="85" y="430" fill="#eef7ff" font-size="21" font-weight="700">Guardrails around the workload</text>
|
||||
|
||||
<g transform="translate(85 462)">
|
||||
<rect width="185" height="74" rx="15" fill="#10243a" stroke="#31506c"/>
|
||||
<text x="92.5" y="31" text-anchor="middle" fill="#65d4ff" font-size="15" font-weight="700">Pod Security</text>
|
||||
<text x="92.5" y="54" text-anchor="middle" fill="#a7bed2" font-size="13">Restricted v1.36</text>
|
||||
</g>
|
||||
<g transform="translate(295 462)">
|
||||
<rect width="185" height="74" rx="15" fill="#10243a" stroke="#31506c"/>
|
||||
<text x="92.5" y="31" text-anchor="middle" fill="#79f2c0" font-size="15" font-weight="700">NetworkPolicy</text>
|
||||
<text x="92.5" y="54" text-anchor="middle" fill="#a7bed2" font-size="13">Ingress only</text>
|
||||
</g>
|
||||
<g transform="translate(505 462)">
|
||||
<rect width="185" height="74" rx="15" fill="#10243a" stroke="#31506c"/>
|
||||
<text x="92.5" y="31" text-anchor="middle" fill="#65d4ff" font-size="15" font-weight="700">AppProject</text>
|
||||
<text x="92.5" y="54" text-anchor="middle" fill="#a7bed2" font-size="13">Namespace scoped</text>
|
||||
</g>
|
||||
<g transform="translate(715 462)">
|
||||
<rect width="185" height="74" rx="15" fill="#10243a" stroke="#31506c"/>
|
||||
<text x="92.5" y="31" text-anchor="middle" fill="#79f2c0" font-size="15" font-weight="700">Resource controls</text>
|
||||
<text x="92.5" y="54" text-anchor="middle" fill="#a7bed2" font-size="13">Quota · limits · PDB</text>
|
||||
</g>
|
||||
<g transform="translate(925 462)">
|
||||
<rect width="170" height="74" rx="15" fill="#10243a" stroke="#31506c"/>
|
||||
<text x="85" y="31" text-anchor="middle" fill="#65d4ff" font-size="15" font-weight="700">Observability</text>
|
||||
<text x="85" y="54" text-anchor="middle" fill="#a7bed2" font-size="13">Metrics · logs · alerts</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<rect x="55" y="612" width="1070" height="4" rx="2" fill="url(#accent)" opacity=".8"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.2 KiB |
Reference in New Issue
Block a user