Update index.html

This commit is contained in:
2026-06-21 02:17:59 +00:00
parent 60cf4f2482
commit 39938f6731
+124 -137
View File
@@ -7,218 +7,204 @@
<link rel="stylesheet" href="style.css" /> <link rel="stylesheet" href="style.css" />
</head> </head>
<body> <body>
<header class="hero"> <header class="site-header">
<nav class="nav"> <a class="brand" href="#">
<div class="logo">ByteGeist</div> <img src="assets/images/bytegeist-logo.png" alt="ByteGeist logo" />
<div class="nav-links"> <span>ByteGeist</span>
</a>
<nav>
<a href="#architecture">Architecture</a> <a href="#architecture">Architecture</a>
<a href="#operations">Operations</a> <a href="#operations">Operations</a>
<a href="#security">Security</a> <a href="#security">Security</a>
<a href="#development">CI/CD</a> <a href="#development">Development</a>
<a href="#platform">Platform</a>
<a href="#recovery">Recovery</a> <a href="#recovery">Recovery</a>
</div>
</nav> </nav>
<section class="hero-grid"> <a class="nav-button" href="https://wiki.casko.dev">Docs</a>
<div class="hero-content">
<p class="eyebrow">Self-Hosted Infrastructure Platform</p>
<h1>Infrastructure, security, monitoring, and automation built from scratch.</h1>
<p class="subtext">
ByteGeist Cloud is a self-hosted homelab platform running on Ubuntu, Docker,
Authentik, Grafana, Loki, Prometheus, CrowdSec, Gitea, and Woodpecker CI.
</p>
<div class="buttons">
<a href="https://wiki.casko.dev" class="btn primary">View Documentation</a>
<a href="https://git.casko.dev" class="btn secondary">View Git Server</a>
</div>
</div>
<div class="hero-image">
<img src="assets/images/portfolio-grafana-operations.png" alt="ByteGeist Grafana operations dashboard" />
</div>
</section>
</header> </header>
<main> <main>
<section class="stats"> <section class="hero">
<div><span>26</span><p>Containers</p></div> <div class="hero-copy">
<div><span>20+</span><p>Services</p></div> <p class="eyebrow">Self-Hosted Infrastructure Platform</p>
<div><span>SSO</span><p>Authentik</p></div> <h1>Infrastructure, security, monitoring, and automation <span>built from scratch.</span></h1>
<div><span>CI/CD</span><p>Woodpecker</p></div>
</section>
<section class="section intro">
<h2>What is ByteGeist?</h2>
<p> <p>
ByteGeist Cloud is a self-hosted infrastructure platform built to practice real-world ByteGeist Cloud is a self-hosted infrastructure platform built on Ubuntu, Docker,
Linux administration, Docker operations, networking, identity management, monitoring, Authentik, Grafana, Loki, Prometheus, CrowdSec, Gitea, and Woodpecker CI.
logging, security hardening, backup planning, disaster recovery, and CI/CD automation.
</p> </p>
</section>
<section id="architecture" class="section"> <div class="actions">
<div class="section-heading"> <a href="#architecture" class="button primary">Explore Architecture</a>
<p class="eyebrow">Architecture</p> <a href="https://git.casko.dev" class="button secondary">View Git Server</a>
<h2>Platform Design</h2> </div>
<p>
Traffic flows through Nginx Proxy Manager, authentication is centralized through
Authentik, and services are monitored, logged, backed up, and documented.
</p>
</div> </div>
<div class="feature-image wide"> <div class="hero-art">
<img src="assets/images/bytegeist-logo.png" alt="ByteGeist cyber ghost logo" />
</div>
</section>
<section class="stats">
<div><strong>26</strong><span>Containers</span></div>
<div><strong>20+</strong><span>Services</span></div>
<div><strong>11</strong><span>Protected Apps</span></div>
<div><strong>SSO</strong><span>Authentik</span></div>
<div><strong>CI/CD</strong><span>Woodpecker</span></div>
</section>
<section id="architecture" class="split-section">
<div class="panel large">
<p class="eyebrow">Architecture Overview</p>
<h2>Designed like a small production platform.</h2>
<p>
Traffic flows through Nginx Proxy Manager, access is controlled through Authentik,
and the environment is monitored, logged, secured, backed up, and documented.
</p>
<img src="assets/images/bytegeist-architecture.png" alt="ByteGeist architecture diagram" /> <img src="assets/images/bytegeist-architecture.png" alt="ByteGeist architecture diagram" />
</div> </div>
<div class="panel about">
<p class="eyebrow">About ByteGeist</p>
<h2>Built to prove real infrastructure skills.</h2>
<ul>
<li>Centralized SSO and 2FA</li>
<li>Monitoring and log aggregation</li>
<li>Automated CI/CD pipelines</li>
<li>Threat detection and response</li>
<li>Backups and disaster recovery</li>
<li>Technical documentation</li>
</ul>
</div>
</section> </section>
<section id="operations" class="section"> <section id="operations" class="section">
<div class="section-heading">
<p class="eyebrow">Operations</p> <p class="eyebrow">Operations</p>
<h2>Monitoring & Logging</h2> <h2>Monitoring & Logging</h2>
<p> <div class="card-grid two">
Grafana, Prometheus, Loki, Alloy, Node Exporter, and cAdvisor provide visibility <article class="card">
into system health, container workloads, and infrastructure logs.
</p>
</div>
<div class="screenshot-grid">
<article class="screenshot-card">
<img src="assets/images/portfolio-grafana-operations.png" alt="Grafana operations dashboard" /> <img src="assets/images/portfolio-grafana-operations.png" alt="Grafana operations dashboard" />
<div>
<h3>Infrastructure Monitoring</h3> <h3>Infrastructure Monitoring</h3>
<p>System health, uptime, memory, CPU, disk usage, and container metrics in Grafana.</p> <p>Grafana dashboards show uptime, CPU, memory, disk, container metrics, and system health.</p>
</div>
</article> </article>
<article class="screenshot-card"> <article class="card">
<img src="assets/images/portfolio-grafana-logs.png" alt="Grafana logs dashboard" /> <img src="assets/images/portfolio-grafana-logs.png" alt="Grafana logs dashboard" />
<div>
<h3>Centralized Logging</h3> <h3>Centralized Logging</h3>
<p>Loki and Grafana provide searchable logs for containers and infrastructure troubleshooting.</p> <p>Loki and Grafana provide searchable logs for containers and infrastructure troubleshooting.</p>
</div>
</article> </article>
</div> </div>
</section> </section>
<section id="security" class="section dark"> <section id="security" class="section">
<div class="section-heading">
<p class="eyebrow">Security</p> <p class="eyebrow">Security</p>
<h2>Identity & Threat Detection</h2> <h2>Identity & Threat Protection</h2>
<p> <div class="card-grid two">
Authentik provides single sign-on and access control while Fail2Ban and CrowdSec <article class="card">
detect and block hostile traffic.
</p>
</div>
<div class="screenshot-grid">
<article class="screenshot-card">
<img src="assets/images/portfolio-authentik-applications.png" alt="Authentik application portal" /> <img src="assets/images/portfolio-authentik-applications.png" alt="Authentik application portal" />
<div>
<h3>Centralized Identity</h3> <h3>Centralized Identity</h3>
<p>SSO, OAuth2, OIDC, Forward Auth, and 2FA protect access to internal services.</p> <p>Authentik provides SSO, OAuth2, OIDC, Forward Auth, access control, and 2FA.</p>
</div>
</article> </article>
<article class="screenshot-card"> <article class="card">
<img src="assets/images/portfolio-crowdsec-decisions.png" alt="CrowdSec security decisions" /> <img src="assets/images/portfolio-crowdsec-decisions.png" alt="CrowdSec decisions list" />
<div> <h3>Threat Detection & Response</h3>
<h3>Threat Detection</h3> <p>CrowdSec detects malicious SSH activity and creates firewall decisions to block attackers.</p>
<p>CrowdSec detects brute-force behavior and creates firewall decisions to block attackers.</p>
</div>
</article> </article>
</div> </div>
</section> </section>
<section id="development" class="section"> <section id="development" class="section">
<div class="section-heading">
<p class="eyebrow">Development</p> <p class="eyebrow">Development</p>
<h2>Git Hosting & CI/CD</h2> <h2>Git Hosting & CI/CD</h2>
<p> <div class="card-grid two">
Gitea hosts the code and infrastructure repositories while Woodpecker CI runs automated <article class="card">
pipelines triggered by repository activity.
</p>
</div>
<div class="screenshot-grid">
<article class="screenshot-card">
<img src="assets/images/portfolio-gitea-dashboard.png" alt="Gitea dashboard" /> <img src="assets/images/portfolio-gitea-dashboard.png" alt="Gitea dashboard" />
<div>
<h3>Self-Hosted Git</h3> <h3>Self-Hosted Git</h3>
<p>Gitea manages source code, project history, documentation, and infrastructure repositories.</p> <p>Gitea hosts infrastructure code, documentation, project files, and portfolio development.</p>
</div>
</article> </article>
<article class="screenshot-card"> <article class="card">
<img src="assets/images/portfolio-woodpecker-pipeline.png" alt="Woodpecker successful pipeline" /> <img src="assets/images/portfolio-woodpecker-pipeline.png" alt="Woodpecker successful pipeline" />
<div>
<h3>CI/CD Automation</h3> <h3>CI/CD Automation</h3>
<p>Woodpecker successfully runs automated pipelines connected to Gitea repositories.</p> <p>Woodpecker runs automated pipelines connected to Gitea repositories.</p>
</div>
</article> </article>
</div> </div>
</section> </section>
<section class="section"> <section id="platform" class="section">
<div class="section-heading"> <p class="eyebrow">Platform</p>
<p class="eyebrow">Service Portal</p> <h2>Service Portal</h2>
<h2>Centralized Dashboard</h2> <div class="card-grid two">
<p> <article class="card">
Dashy acts as the launchpad for the environment, organizing infrastructure, <img src="assets/images/portfolio-cloud-dashboard-overview.png" alt="Dashy overview" />
observability, development, security, tools, and user services.
</p>
</div>
<div class="screenshot-grid">
<article class="screenshot-card">
<img src="assets/images/portfolio-cloud-dashboard-overview.png" alt="Dashy dashboard overview" />
<div>
<h3>Operations Portal</h3> <h3>Operations Portal</h3>
<p>Quick access to core infrastructure, observability, and development services.</p> <p>Dashy provides quick access to infrastructure, observability, and development services.</p>
</div>
</article> </article>
<article class="screenshot-card"> <article class="card">
<img src="assets/images/portfolio-cloud-dashboard-services.png" alt="Dashy service catalog" /> <img src="assets/images/portfolio-cloud-dashboard-services.png" alt="Dashy services" />
<div>
<h3>Service Catalog</h3> <h3>Service Catalog</h3>
<p>Organized access to security tools, utilities, file management, and public sites.</p> <p>Organized access to security tools, utilities, file management, and public sites.</p>
</div>
</article> </article>
</div> </div>
</section> </section>
<section id="recovery" class="section dark"> <section id="recovery" class="section">
<div class="section-heading">
<p class="eyebrow">Recovery</p> <p class="eyebrow">Recovery</p>
<h2>Documentation & Disaster Recovery</h2> <h2>Documentation & Disaster Recovery</h2>
<div class="feature-card">
<img src="assets/images/portfolio-wiki-disaster-recovery.png" alt="Disaster recovery documentation" />
<div>
<h3>Recovery Planning</h3>
<p> <p>
ByteGeist includes documented restore procedures, backup validation, service inventory, ByteGeist includes documented restore procedures, backup validation, service inventory,
DNS information, and recovery priorities. DNS information, recovery priorities, and full environment rebuild planning.
</p> </p>
</div> </div>
<div class="feature-image">
<img src="assets/images/portfolio-wiki-disaster-recovery.png" alt="ByteGeist disaster recovery documentation" />
</div> </div>
</section> </section>
<section class="section skills"> <section class="section challenges">
<h2>Skills Demonstrated</h2> <p class="eyebrow">Technical Challenges</p>
<div class="skills-grid"> <h2>Problems Solved</h2>
<div class="challenge-grid">
<div>
<h3>OIDC Integration</h3>
<p>Resolved redirect URI mismatches, user provisioning, and authorization issues.</p>
</div>
<div>
<h3>Forward Auth</h3>
<p>Integrated Authentik Forward Auth with reverse proxy protected services.</p>
</div>
<div>
<h3>Observability</h3>
<p>Built centralized metrics and logging using Grafana, Prometheus, Loki, and Alloy.</p>
</div>
<div>
<h3>Security Hardening</h3>
<p>Implemented SSH key-only login, Fail2Ban, CrowdSec, UFW, TLS, and SSO.</p>
</div>
</div>
</section>
<section class="skills">
<h2>Core Skills Demonstrated</h2>
<div class="skills-list">
<span>Linux Administration</span> <span>Linux Administration</span>
<span>Docker</span> <span>Docker & Compose</span>
<span>Docker Compose</span>
<span>Reverse Proxies</span> <span>Reverse Proxies</span>
<span>SSL/TLS</span> <span>Networking</span>
<span>DNS</span> <span>TLS / SSL</span>
<span>SSO</span> <span>DNS Management</span>
<span>OAuth2 / OIDC</span> <span>Identity Management</span>
<span>Monitoring</span> <span>SSO / OAuth2 / OIDC</span>
<span>Monitoring & Observability</span>
<span>Centralized Logging</span> <span>Centralized Logging</span>
<span>CI/CD</span> <span>CI/CD Automation</span>
<span>Security Hardening</span> <span>Security Hardening</span>
<span>Threat Detection</span> <span>Threat Detection & Response</span>
<span>Backup Strategy</span> <span>Backup Strategy</span>
<span>Disaster Recovery</span> <span>Disaster Recovery</span>
<span>Technical Documentation</span> <span>Technical Documentation</span>
@@ -227,7 +213,8 @@
</main> </main>
<footer> <footer>
<p>ByteGeist Cloud • Built and maintained by Keith Casko</p> <span>ByteGeist Cloud</span>
<p>Built and maintained by Keith Casko</p>
</footer> </footer>
</body> </body>
</html> </html>