Update portfolio website

This commit is contained in:
Keith Casko
2026-10-02 09:29:22 -04:00
parent 7def1c8410
commit 65582587f5
28 changed files with 2371 additions and 1676 deletions
+480 -382
View File
@@ -3,420 +3,518 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="ByteGeist infrastructure control plane — a live view into Keith Casko's self-hosted cloud environment." />
<title>ByteGeist / Control Plane</title>
<link rel="icon" href="assets/images/bytegeist-logo.png" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="style.css" />
<script src="script.js" defer></script>
<title>Keith Casko &mdash; IT Support, Systems Administration, Cloud Operations</title>
<meta name="description" content="Keith Casko &mdash; IT portfolio: Windows Server, Active Directory, Linux, AWS, Docker, networking, and troubleshooting projects. Based in Kalamazoo, Michigan." />
<link rel="stylesheet" href="css/styles.css" />
</head>
<body>
<div class="scanline" aria-hidden="true"></div>
<header class="control-bar">
<a class="wordmark" href="#overview" aria-label="ByteGeist control plane">
<img src="assets/images/bytegeist-logo.png" alt="" />
<span>BYTEGEIST</span>
<small>/ CONTROL PLANE</small>
</a>
<div class="control-state">
<span class="status-dot"></span>
<span>INFRASTRUCTURE NOMINAL</span>
</div>
<nav aria-label="Control plane navigation">
<a href="#overview">Overview</a>
<a href="#topology">Topology</a>
<a href="#observability">Observability</a>
<a href="#services">Services</a>
<a href="#security">Security</a>
</nav>
<div class="clock" aria-label="Current local time">
<span id="local-time">--:--:--</span>
<small>AMERICA / NEW YORK</small>
<!-- ============ Header ============ -->
<header class="site-header" role="banner">
<div class="container">
<div class="brand">
<span class="name">Keith Casko</span>
<span class="tagline">
IT Support &nbsp;|&nbsp; Systems Administration &nbsp;|&nbsp; Cloud Operations
<span class="location">Kalamazoo, MI</span>
</span>
</div>
<button class="nav-toggle" aria-expanded="false" aria-controls="primary-nav">Menu</button>
<nav class="site-nav" id="primary-nav" aria-label="Primary">
<ul>
<li><a href="#home" class="active">Home</a></li>
<li><a href="#projects">Projects</a></li>
<li><a href="#homelab">Homelab</a></li>
<li><a href="#troubleshooting">Troubleshooting</a></li>
<li><a href="#about">About</a></li>
<li><a href="#resume">Resume</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</nav>
</div>
</header>
<main>
<section id="overview" class="command-grid">
<aside class="system-rail" aria-label="System status">
<div class="rail-heading">
<span>NODE</span>
<strong>BG-CORE-01</strong>
</div>
<dl class="rail-data">
<div><dt>Provider</dt><dd>Hetzner</dd></div>
<div><dt>OS</dt><dd>Ubuntu 24.04</dd></div>
<div><dt>Runtime</dt><dd>Docker</dd></div>
<div><dt>Region</dt><dd>US-East</dd></div>
<div><dt>Ingress</dt><dd>NPM / TLS</dd></div>
<div><dt>Identity</dt><dd>Authentik</dd></div>
</dl>
<div class="rail-health">
<span>HOST HEALTH</span>
<div class="health-bar"><i style="--value: 92%"></i></div>
<strong>92%</strong>
</div>
<a href="https://wiki.casko.dev">OPEN RUNBOOKS <span>↗</span></a>
<a href="https://git.casko.dev">GIT SERVER <span>↗</span></a>
</aside>
<div class="overview-console">
<div class="console-label">
<span>OVERVIEW / LIVE</span>
<span id="refresh-indicator">UPDATED 00s AGO</span>
</div>
<div class="identity-block">
<!-- ============ Hero ============ -->
<section class="hero" id="home" aria-labelledby="hero-title">
<div class="container">
<div class="hero-grid">
<div>
<p class="overline">SELF-HOSTED INFRASTRUCTURE ENVIRONMENT</p>
<h1>Personal cloud.<br />Operational by design.</h1>
<h1 id="hero-title">Building Reliable Systems.<br />Solving Real Problems.</h1>
<p class="lede">
Hands-on experience with Windows Server, Active Directory, Linux, AWS,
networking, Docker, monitoring, remote administration, and technical
troubleshooting.
</p>
<p>
Currently completing a B.S. in Software Engineering at Western Governors
University while building practical infrastructure and support experience
through a dedicated homelab, AWS projects, and ongoing study of systems
administration and cloud operations.
</p>
<div class="hero-actions">
<a class="btn btn-primary" href="#projects">View Projects</a>
<!-- REPLACE: resume PDF path -->
<a class="btn btn-secondary" href="assets/resume/keith-casko-resume.pdf" download>Download Resume</a>
</div>
</div>
<p class="operator-note">
A working infrastructure lab for identity, observability, delivery, security,
and recovery. Built and maintained as an evolving system—not a static demo.
</p>
<div class="hero-image">
<!-- REPLACE: assets/images/hero-rack.jpg with a real homelab / rack / workstation photo -->
<div class="image-placeholder" role="img" aria-label="Placeholder for homelab or server rack photo">
[ Homelab / server rack / workstation photo &mdash;<br />
assets/images/hero-rack.jpg ]
</div>
</div>
</div>
</div>
</section>
<!-- ============ Featured Projects ============ -->
<section id="projects" aria-labelledby="projects-title">
<div class="container">
<div class="section-head">
<h2 id="projects-title">Featured Projects</h2>
<span class="subtitle">Hands-on infrastructure, support, and cloud work</span>
</div>
<div class="metric-board" aria-label="Infrastructure metrics">
<article class="metric metric-primary">
<span>SERVICES ONLINE</span>
<strong data-count="20">20</strong><small>/ 20</small>
<div class="spark-bars" aria-hidden="true">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
<div class="projects-grid">
<article class="project-card">
<div class="thumb">
<!-- REPLACE: assets/screenshots/bytegeist-ad.jpg -->
<div class="image-placeholder" role="img" aria-label="ByteGeist Windows Server Lab screenshot placeholder">
Windows Server / AD screenshot
</div>
</div>
<div class="body">
<h3>ByteGeist Windows Server Lab</h3>
<p>
A hands-on Windows Server 2022 and Active Directory domain used to
practice help desk and junior sysadmin workflows: OUs, users and
groups, domain joins, file shares, permissions, and DNS
troubleshooting.
</p>
<!-- Public profile; swap for a dedicated repo once published -->
<a class="view-link" href="https://github.com/kcasko" rel="noopener">View Project</a>
</div>
</article>
<article class="project-card">
<div class="thumb">
<img src="assets/screenshots/bytegeist-support-live.png"
alt="ByteGeist Support Lab &mdash; live app screenshot" />
</div>
<div class="body">
<h3>ByteGeist Support Lab</h3>
<p>
An interactive IT troubleshooting application on AWS (Amplify,
Lambda, API Gateway, DynamoDB) with React. Realistic support
incidents, command-line workflows, diagnosis, resolution, and
scoring.
</p>
<a class="view-link" href="https://supportlab.casko.dev/" rel="noopener">View Live Site</a>
</div>
</article>
<article class="project-card">
<div class="thumb">
<!-- REPLACE: assets/screenshots/linux-docker.jpg -->
<div class="image-placeholder" role="img" aria-label="Linux and Docker homelab screenshot placeholder">
Docker / monitoring screenshot
</div>
</div>
<div class="body">
<h3>Linux &amp; Docker Homelab</h3>
<p>
A self-hosted Ubuntu and WSL2 environment running Docker,
Portainer, Nextcloud, and monitoring tools behind an Nginx reverse
proxy with Cloudflare-managed TLS. Used to deploy, monitor, and
troubleshoot services.
</p>
<a class="view-link" href="https://github.com/kcasko/taurustech-stack" rel="noopener">View Project</a>
</div>
</article>
<article class="project-card">
<div class="thumb">
<img src="assets/screenshots/aws-tracker.png"
alt="AWS Cloud Study Tracker &mdash; live app screenshot" />
</div>
<div class="body">
<h3>AWS Cloud Study Tracker</h3>
<p>
A serverless AWS CRUD application built with Amplify, API Gateway,
Lambda, DynamoDB, and IAM. Used to practice AWS serverless
architecture, permissions, and least-privilege access.
</p>
<a class="view-link" href="https://production.d2kf0c9e1fogq3.amplifyapp.com/" rel="noopener">View Live Site</a>
</div>
</article>
<article class="metric">
<span>UPTIME</span>
<strong>99.98</strong><small>%</small>
<p>30 DAY WINDOW</p>
</article>
<article class="metric">
<span>CONTAINERS</span>
<strong data-count="26">26</strong>
<p>26 RUNNING / 0 DEGRADED</p>
</article>
<article class="metric">
<span>ACTIVE DOMAINS</span>
<strong data-count="11">11</strong>
<p>TLS VALID / PROXIED</p>
</article>
<article class="metric">
<span>CPU LOAD</span>
<strong>16.2</strong><small>%</small>
<div class="meter"><i style="--value: 16.2%"></i></div>
</article>
<article class="metric">
<span>MEMORY</span>
<strong>61.6</strong><small>%</small>
<div class="meter warning"><i style="--value: 61.6%"></i></div>
</article>
</div>
<div class="operations-window">
<div class="window-bar">
<span><i class="live-dot"></i> GRAFANA / BYTEGEIST OPERATIONS</span>
<a href="assets/images/portfolio-grafana-operations.png" target="_blank">FULL RES ↗</a>
</div>
<img src="assets/images/portfolio-grafana-operations.png" alt="Grafana operations dashboard showing ByteGeist infrastructure health" />
</div>
</div>
<aside class="activity-panel">
<div class="panel-title">
<span>EVENT STREAM</span>
<small>LIVE</small>
</div>
<ol class="event-list">
<li>
<time>22:14:08</time>
<span class="event-ok">DEPLOY</span>
<p>portfolio/main completed</p>
</li>
<li>
<time>21:48:32</time>
<span class="event-info">AUTH</span>
<p>OIDC session issued</p>
</li>
<li>
<time>20:03:17</time>
<span class="event-ok">BACKUP</span>
<p>volume snapshot verified</p>
</li>
<li>
<time>18:42:55</time>
<span class="event-warn">SEC</span>
<p>CrowdSec decision added</p>
</li>
<li>
<time>16:11:09</time>
<span class="event-info">DNS</span>
<p>certificate renewed</p>
</li>
</ol>
<div class="deployment-status">
<span>LAST DEPLOYMENT</span>
<strong>SUCCESS</strong>
<p>Woodpecker pipeline #184</p>
<div><i></i><i></i><i></i><i></i></div>
</div>
<div class="terminal-mini" aria-label="Recent terminal output">
<p><span>$</span> docker ps --format status</p>
<p class="terminal-output">26 containers running</p>
<p><span>$</span> systemctl is-system-running</p>
<p class="terminal-output">running<span class="cursor">_</span></p>
</div>
</aside>
</section>
<section id="topology" class="module topology-module">
<header class="module-header">
<div>
<span class="module-id">SYS.01</span>
<h2>Infrastructure topology</h2>
<!-- ============ What I Work With ============ -->
<section id="homelab" aria-labelledby="skills-title">
<div class="container">
<div class="section-head">
<h2 id="skills-title">What I Work With</h2>
<span class="subtitle">Tools, platforms, and areas of practical experience</span>
</div>
<p>Traffic, identity, workloads, telemetry, and recovery paths on the current host.</p>
<div class="module-state"><i></i> DOCUMENTED</div>
</header>
<div class="topology-layout">
<div class="stack-index">
<div class="skills-grid">
<div class="skill-card">
<div class="skill-head">
<svg class="ico" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
<path d="M3 5.5 11 4v8H3V5.5zM13 3.75 21 2.5V12h-8V3.75zM3 13h8v7L3 18.5V13zm10 0h8v8.5L13 20v-7z"/>
</svg>
<h3>Windows &amp; Active Directory</h3>
</div>
<ul>
<li>Windows 10 / 11</li>
<li>Windows Server 2022</li>
<li>Active Directory</li>
<li>Users &amp; groups, OUs</li>
<li>Domain joins</li>
<li>File shares &amp; permissions</li>
<li>DNS</li>
</ul>
</div>
<div class="skill-card">
<div class="skill-head">
<svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<rect x="3" y="4" width="18" height="16" rx="1.5"/>
<path d="m7 9 3 3-3 3M12 15h5"/>
</svg>
<h3>Linux</h3>
</div>
<ul>
<li>Ubuntu</li>
<li>WSL2</li>
<li>Bash</li>
<li>SSH</li>
<li>Linux administration</li>
</ul>
</div>
<div class="skill-card">
<div class="skill-head">
<svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M7 18a4 4 0 0 1-.9-7.9A6 6 0 0 1 18 10.5a3.5 3.5 0 0 1-.5 7H7z"/>
</svg>
<h3>AWS</h3>
</div>
<ul>
<li>EC2, S3, IAM</li>
<li>Lambda</li>
<li>API Gateway</li>
<li>DynamoDB</li>
<li>Amplify</li>
<li>Systems Manager</li>
<li>KMS</li>
</ul>
</div>
<div class="skill-card">
<div class="skill-head">
<svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<circle cx="12" cy="4" r="2"/>
<circle cx="4" cy="20" r="2"/>
<circle cx="20" cy="20" r="2"/>
<path d="M12 6v6M12 12l-7 6M12 12l7 6"/>
</svg>
<h3>Networking</h3>
</div>
<ul>
<li>TCP/IP, IPv4 / IPv6</li>
<li>DNS, DHCP</li>
<li>SSH, HTTP/HTTPS, TLS</li>
<li>VPNs</li>
<li>Reverse proxies</li>
<li>Firewalls</li>
</ul>
</div>
<div class="skill-card">
<div class="skill-head">
<svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M4 14v-2a8 8 0 1 1 16 0v2"/>
<rect x="2.5" y="14" width="4.5" height="6" rx="1"/>
<rect x="17" y="14" width="4.5" height="6" rx="1"/>
<path d="M17 20a3 3 0 0 1-3 3h-2"/>
</svg>
<h3>IT Support</h3>
</div>
<ul>
<li>Troubleshooting</li>
<li>Customer &amp; remote support</li>
<li>Technical communication</li>
<li>Incident resolution</li>
<li>Permissions &amp; authentication</li>
<li>Connectivity testing</li>
</ul>
</div>
<div class="skill-card">
<div class="skill-head">
<svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<rect x="3" y="4" width="18" height="5" rx="1"/>
<rect x="3" y="11" width="18" height="5" rx="1"/>
<rect x="3" y="18" width="18" height="3" rx="1"/>
<path d="M6.5 6.5h.01M6.5 13.5h.01"/>
</svg>
<h3>Infrastructure</h3>
</div>
<ul>
<li>Docker, Docker Compose</li>
<li>VirtualBox</li>
<li>Portainer</li>
<li>Grafana, Prometheus</li>
<li>Loki</li>
<li>Uptime Kuma</li>
</ul>
</div>
<div class="skill-card">
<div class="skill-head">
<svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<rect x="2.5" y="4" width="19" height="12" rx="1.5"/>
<path d="M8 20h8M12 16v4"/>
</svg>
<h3>Remote Administration</h3>
</div>
<ul>
<li>RDP</li>
<li>Parsec</li>
<li>Tailscale</li>
<li>RealVNC</li>
</ul>
</div>
<div class="skill-card">
<div class="skill-head">
<svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="m8 7-5 5 5 5M16 7l5 5-5 5M14 5l-4 14"/>
</svg>
<h3>Scripting &amp; Tools</h3>
</div>
<ul>
<li>PowerShell</li>
<li>Bash</li>
<li>Git</li>
<li>GitHub</li>
</ul>
</div>
</div>
</div>
</section>
<!-- ============ Troubleshooting Notes ============ -->
<section id="troubleshooting" aria-labelledby="notes-title">
<div class="container">
<div class="section-head">
<h2 id="notes-title">Troubleshooting Notes</h2>
<span class="subtitle">Short, practical case studies</span>
</div>
<div class="notes-list">
<article class="note-item">
<div class="icon" aria-hidden="true">DNS</div>
<div>
<h3>DNS Resolution Issue</h3>
<p>Client cannot reach a service by name but can reach it by IP &mdash; isolate DNS from general network connectivity.</p>
<ul>
<li>Confirm TCP/IP configuration with <code>ipconfig /all</code></li>
<li>Verify DNS server settings and search suffix</li>
<li>Test reachability with <code>ping</code> against both hostname and IP</li>
<li>Use <code>nslookup</code> against the primary and a known-good DNS server</li>
<li>Flush client resolver cache; compare behavior from another host</li>
</ul>
</div>
<div class="chevron" aria-hidden="true">&rsaquo;</div>
</article>
<article class="note-item">
<div class="icon" aria-hidden="true">DKR</div>
<div>
<h3>Docker Networking Problem</h3>
<p>A container responds locally but is unreachable from other hosts, or outbound requests fail.</p>
<ul>
<li>Check container state with <code>docker ps</code> and <code>docker logs</code></li>
<li>Verify published ports and the attached Docker network</li>
<li>Confirm DNS resolution from inside the container</li>
<li>Check host firewall rules affecting the bridge or published ports</li>
<li>Test HTTP endpoints with <code>curl -v</code> from host and container</li>
</ul>
</div>
<div class="chevron" aria-hidden="true">&rsaquo;</div>
</article>
<article class="note-item">
<div class="icon" aria-hidden="true">AD</div>
<div>
<h3>Active Directory Permissions Issue</h3>
<p>A user authenticates successfully but cannot access a shared folder they should.</p>
<ul>
<li>Confirm the user's identity and group membership</li>
<li>Review share permissions and NTFS permissions separately</li>
<li>Check for deny ACEs that override group access</li>
<li>Validate authentication path and session with <code>whoami /groups</code></li>
<li>Test access from a known-good account to isolate user vs. share</li>
</ul>
</div>
<div class="chevron" aria-hidden="true">&rsaquo;</div>
</article>
<article class="note-item">
<div class="icon" aria-hidden="true">IAM</div>
<div>
<h3>AWS IAM Access Problem</h3>
<p>A workload or user receives <em>AccessDenied</em> when calling an AWS service.</p>
<ul>
<li>Identify the exact action, resource, and principal from the error</li>
<li>Review attached identity and resource policies against least privilege</li>
<li>Check for explicit denies, SCPs, and permission boundaries</li>
<li>Reproduce with the IAM Policy Simulator</li>
<li>Grant only the specific action needed; verify, then narrow further</li>
</ul>
</div>
<div class="chevron" aria-hidden="true">&rsaquo;</div>
</article>
</div>
</div>
</section>
<!-- ============ About ============ -->
<section id="about" aria-labelledby="about-title">
<div class="container">
<div class="section-head">
<h2 id="about-title">About</h2>
<span class="subtitle">Background and focus</span>
</div>
<div class="about-grid">
<div class="about-photo">
<!-- REPLACE: assets/images/portrait.jpg -->
<div class="image-placeholder" role="img" aria-label="Portrait photo placeholder">
[ Portrait photo &mdash;<br />assets/images/portrait.jpg ]
</div>
</div>
<div class="about-text">
<h3>Keith Casko &mdash; Kalamazoo, Michigan</h3>
<p>
I'm transitioning into IT, cloud, and systems administration while
completing a B.S. in Software Engineering at Western Governors
University. My focus is practical, hands-on infrastructure work:
Windows Server and Active Directory, Linux, AWS, Docker, networking,
and technical troubleshooting.
</p>
<p>
My professional background is at Costco Wholesale as a Baker. The job
is production-paced and team-based, and it's where I developed the
habits I bring to IT work &mdash; customer service, teamwork, training
coworkers, process discipline, prioritization, and real-world
problem-solving under pressure.
</p>
</div>
<aside class="pull-quote" aria-label="Approach">
<span class="mark">&ldquo;</span>
Reliable systems are built one careful change at a time. I'd rather
understand a problem than paper over it &mdash; and I document what I
learn so the next person has a shorter path.
</aside>
</div>
</div>
</section>
<!-- ============ Education & Experience ============ -->
<section id="resume" aria-labelledby="resume-title">
<div class="container">
<div class="section-head">
<h2 id="resume-title">Education &amp; Experience</h2>
<span class="subtitle">Current study and professional background</span>
</div>
<div class="two-col">
<div class="panel">
<h3>Western Governors University</h3>
<div class="meta">Bachelor of Science, Software Engineering &middot; In Progress</div>
<h4>Relevant Study</h4>
<ul>
<li>Cloud Computing</li>
<li>Networking</li>
<li>IT Operations</li>
<li>Software Development</li>
<li>Java</li>
<li>Web Development</li>
<li>Security Fundamentals</li>
</ul>
</div>
<div class="panel">
<h3>Costco Wholesale &mdash; Baker</h3>
<div class="meta">June 2015 &ndash; Present</div>
<h4>Transferable Experience</h4>
<ul>
<li>High-volume production environment</li>
<li>Accuracy and process discipline</li>
<li>Prioritization under time pressure</li>
<li>Day-to-day troubleshooting of equipment and workflows</li>
<li>Coordinating with team members and supervisors</li>
<li>Training coworkers on procedures</li>
<li>Customer service and clear communication</li>
<li>Problem solving and follow-through</li>
</ul>
</div>
</div>
</div>
</section>
<!-- ============ Contact ============ -->
<section id="contact" aria-labelledby="contact-title">
<div class="container">
<div class="contact-cta">
<div>
<span>EDGE</span>
<strong>Nginx Proxy Manager</strong>
<small>TLS termination / routing</small>
<h2 id="contact-title">Open to IT Support, Help Desk, and Junior SysAdmin roles</h2>
<p>Based in Kalamazoo, Michigan &mdash; available on-site, hybrid, or remote.</p>
</div>
<div>
<span>IDENTITY</span>
<strong>Authentik</strong>
<small>OIDC / SSO / 2FA</small>
</div>
<div>
<span>COMPUTE</span>
<strong>Docker Compose</strong>
<small>26 active containers</small>
</div>
<div>
<span>TELEMETRY</span>
<strong>Prometheus + Loki</strong>
<small>Metrics / logs / alerts</small>
</div>
</div>
<figure class="system-map">
<a href="assets/images/bytegeist-architecture.png" target="_blank">
<img src="assets/images/bytegeist-architecture.png" alt="ByteGeist infrastructure architecture diagram" />
</a>
<figcaption>
<span>BYTEGEIST-CLOUD / REV 04</span>
<span>SELECT DIAGRAM TO INSPECT</span>
</figcaption>
</figure>
</div>
</section>
<section id="observability" class="module evidence-module">
<header class="module-header">
<div>
<span class="module-id">OBS.02</span>
<h2>Monitoring stack</h2>
</div>
<p>Host metrics, container telemetry, centralized logs, and independent uptime checks.</p>
<div class="module-state"><i></i> COVERAGE ACTIVE</div>
</header>
<div class="evidence-grid">
<figure class="evidence evidence-wide">
<figcaption>
<span>LOG PIPELINE</span>
<strong>Loki / Grafana Alloy</strong>
<small>Container output searchable by service and host</small>
</figcaption>
<a href="assets/images/portfolio-grafana-logs.png" target="_blank">
<img src="assets/images/portfolio-grafana-logs.png" alt="Centralized logs in Grafana" />
</a>
</figure>
<div class="coverage-matrix">
<div class="panel-title"><span>MONITORING COVERAGE</span><small>6 / 6</small></div>
<ul>
<li><span>Host metrics</span><i>ACTIVE</i></li>
<li><span>Container metrics</span><i>ACTIVE</i></li>
<li><span>Application logs</span><i>ACTIVE</i></li>
<li><span>Endpoint uptime</span><i>ACTIVE</i></li>
<li><span>Resource alerts</span><i>ACTIVE</i></li>
<li><span>Security events</span><i>ACTIVE</i></li>
</ul>
<div class="stack-list">
<span>Grafana</span><span>Prometheus</span><span>Loki</span>
<span>Alloy</span><span>Node Exporter</span><span>cAdvisor</span>
<!-- REPLACE: mailto address -->
<a class="btn btn-primary" href="mailto:you@example.com">Email Keith</a>
</div>
</div>
</div>
</section>
<section id="services" class="module services-module">
<header class="module-header">
<div>
<span class="module-id">APP.03</span>
<h2>Service inventory</h2>
</div>
<p>Core applications currently exposed through the internal service portal.</p>
<div class="module-state"><i></i> 20 ONLINE</div>
</header>
<div class="service-layout">
<div class="service-table" role="table" aria-label="Service inventory">
<div class="service-row service-head" role="row">
<span>Service</span><span>Role</span><span>Access</span><span>State</span>
</div>
<div class="service-row"><strong>Gitea</strong><span>Source control</span><span>SSO</span><i>ONLINE</i></div>
<div class="service-row"><strong>Wiki.js</strong><span>Documentation</span><span>SSO</span><i>ONLINE</i></div>
<div class="service-row"><strong>Dashy</strong><span>Service portal</span><span>SSO</span><i>ONLINE</i></div>
<div class="service-row"><strong>Vaultwarden</strong><span>Secrets</span><span>DIRECT</span><i>ONLINE</i></div>
<div class="service-row"><strong>Stirling PDF</strong><span>Document tools</span><span>SSO</span><i>ONLINE</i></div>
<div class="service-row"><strong>IT Tools</strong><span>Utilities</span><span>SSO</span><i>ONLINE</i></div>
<div class="service-row"><strong>Uptime Kuma</strong><span>Availability</span><span>SSO</span><i>ONLINE</i></div>
</div>
<figure class="portal-shot">
<figcaption>
<span>SERVICE PORTAL</span>
<small>Dashy / internal access layer</small>
</figcaption>
<a href="assets/images/portfolio-cloud-dashboard-overview.png" target="_blank">
<img src="assets/images/portfolio-cloud-dashboard-overview.png" alt="ByteGeist Dashy service portal" />
</a>
</figure>
</div>
</section>
<section class="module devops-module">
<header class="module-header">
<div>
<span class="module-id">DEV.04</span>
<h2>Delivery pipeline</h2>
</div>
<p>Git-based workflows from repository change to automated deployment.</p>
<div class="module-state"><i></i> LAST RUN PASSED</div>
</header>
<div class="pipeline">
<div class="pipeline-flow" aria-label="Deployment pipeline">
<div><span>01</span><strong>COMMIT</strong><small>Gitea repository</small></div>
<b>→</b>
<div><span>02</span><strong>BUILD</strong><small>Woodpecker runner</small></div>
<b>→</b>
<div><span>03</span><strong>VERIFY</strong><small>Static checks</small></div>
<b>→</b>
<div><span>04</span><strong>DEPLOY</strong><small>Docker host</small></div>
</div>
<div class="pipeline-shots">
<figure>
<figcaption>GITEA / REPOSITORIES</figcaption>
<a href="assets/images/portfolio-gitea-dashboard.png" target="_blank">
<img src="assets/images/portfolio-gitea-dashboard.png" alt="Gitea repositories dashboard" />
</a>
</figure>
<figure>
<figcaption>WOODPECKER / PIPELINE</figcaption>
<a href="assets/images/portfolio-woodpecker-pipeline.png" target="_blank">
<img src="assets/images/portfolio-woodpecker-pipeline.png" alt="Successful Woodpecker CI pipeline" />
</a>
</figure>
</div>
</div>
</section>
<section id="security" class="module security-module">
<header class="module-header">
<div>
<span class="module-id">SEC.05</span>
<h2>Identity & perimeter</h2>
</div>
<p>Central authentication, protected services, and automated hostile-traffic decisions.</p>
<div class="module-state"><i></i> ENFORCING</div>
</header>
<div class="security-layout">
<figure class="auth-shot">
<figcaption>
<span>AUTHENTIK</span>
<small>11 protected applications / 2FA enforced</small>
</figcaption>
<a href="assets/images/portfolio-authentik-applications.png" target="_blank">
<img src="assets/images/portfolio-authentik-applications.png" alt="Applications protected by Authentik" />
</a>
</figure>
<div class="security-data">
<div class="security-score">
<span>ACCESS POSTURE</span>
<strong>HARDENED</strong>
<small>KEY-ONLY SSH / SSO / TLS</small>
</div>
<ul>
<li><span>OIDC providers</span><strong>04</strong></li>
<li><span>Forward-auth apps</span><strong>07</strong></li>
<li><span>2FA policy</span><strong>ENFORCED</strong></li>
<li><span>Public SSH password</span><strong>DISABLED</strong></li>
</ul>
</div>
<figure class="crowdsec-shot">
<figcaption>
<span>CROWDSEC / ACTIVE DECISIONS</span>
<small>Automated hostile source blocking</small>
</figcaption>
<a href="assets/images/portfolio-crowdsec-decisions.png" target="_blank">
<img src="assets/images/portfolio-crowdsec-decisions.png" alt="CrowdSec active firewall decisions" />
</a>
</figure>
</div>
</section>
<section class="module recovery-module">
<header class="module-header">
<div>
<span class="module-id">DR.06</span>
<h2>Recovery state</h2>
</div>
<p>Configuration in Git, persistent data backups, and an explicit rebuild sequence.</p>
<div class="module-state"><i></i> RUNBOOK CURRENT</div>
</header>
<div class="recovery-layout">
<div class="recovery-sequence">
<div><span>01</span><strong>Provision host</strong><small>Ubuntu / firewall / SSH</small></div>
<div><span>02</span><strong>Restore config</strong><small>Git / Compose / secrets</small></div>
<div><span>03</span><strong>Restore data</strong><small>Volumes / databases</small></div>
<div><span>04</span><strong>Validate edge</strong><small>DNS / TLS / identity</small></div>
</div>
<figure>
<a href="assets/images/portfolio-wiki-disaster-recovery.png" target="_blank">
<img src="assets/images/portfolio-wiki-disaster-recovery.png" alt="ByteGeist disaster recovery runbook" />
</a>
</figure>
</div>
</section>
</main>
<footer>
<div class="footer-mark">
<img src="assets/images/bytegeist-logo.png" alt="" />
<div><strong>BYTEGEIST</strong><span>KEITH CASKO / INFRASTRUCTURE LAB</span></div>
<!-- ============ Footer ============ -->
<footer class="site-footer" role="contentinfo">
<div class="container">
<div>&copy; <span id="year">2026</span> Keith Casko. All rights reserved.</div>
<ul class="footer-links">
<!-- REPLACE: resume path -->
<li><a href="assets/resume/keith-casko-resume.pdf">Resume</a></li>
<li><a href="https://github.com/kcasko" rel="noopener">GitHub</a></li>
<!-- REPLACE: LinkedIn URL -->
<li><a href="https://www.linkedin.com/in/REPLACE_ME" rel="noopener">LinkedIn</a></li>
<!-- REPLACE: email -->
<li><a href="mailto:you@example.com">Email</a></li>
</ul>
</div>
<p>PLAIN HTML / CSS / JAVASCRIPT</p>
<p>STATUS: <span class="status-text">OPERATIONAL</span></p>
</footer>
<script src="js/main.js" defer></script>
</body>
</html>