blog/src/index.njk

---
layout: layouts/base.njk
title: "River Rooks | Homelab Gateway"
---

<!-- Main Hero Landing Tile -->
<section class="hero-tile" aria-label="Gateway Declaration">
  <div class="hero-pretitle">SYSTEM DECLARATION &bull; NODE GATEWAY</div>
  <h1 class="hero-main-title">Cybersecurity &amp; Dev Ops notes</h1>

  <div class="hero-landing-text">
    <p>
      I am River Rooks, a cybersecurity student and the University of Alabama. This website is the public-facing gateway to my homelab, which hosts a variety of services and tools for personal and professional use. Here, you can find my technical blog and a collection of public tools that host.
    </p>
    <p>
      I deploy and maintain a variety of services in my homelab for research, development, and learning purposes. This includes web applications, databases, and other tools that I use to enhance my skills in cybersecurity and DevOps. 
    </p>
    <p>
    My blog serves as a way to share some of my extensive notes with the public. I primarily focus on Capture The Flag (CTF) writeups, technical guides, and other cybersecurity-related content. I also use this platform to document my learning journey and share insights into the world of cybersecurity and DevOps.
  </div>

  <div class="hero-directive-box">
    <strong>PRIMARY DESTINATIONS:</strong>
    <a href="/dispatches/" style="color: var(--accent-cyan); text-decoration: none; margin-left: 8px;">[1] Technical Blog ({{ collections.posts.length }} Articles)</a> &bull;
    <a href="https://git.{{ site.domain }}" target="_blank" rel="noopener noreferrer" style="color: inherit; text-decoration: none;">[2] Gitea Repos</a> &bull;
    <span>[3] Public Tools</span> &bull;
    <span>[4] Cluster Telemetry</span>
  </div>
</section>

<!-- Split Tiling Columns -->
<div class="split-grid">
  <!-- Left Column: Featured Service (Blog) + Dynamic Recent Articles -->
  <div style="display: flex; flex-direction: column; gap: var(--tile-gap);">
    <section class="tile" aria-label="Featured Service: Technical Blog">
      <header class="tile-header">
        <div class="tile-title">
          <span class="status-indicator"></span>
          // PRIMARY SERVICE: THE TECHNICAL BLOG
        </div>
        <span class="tile-meta">~/notes/ &bull; {{ collections.posts.length }} ARTICLES</span>
      </header>

      <div class="blog-service-feature">
        <div class="blog-feature-top">
          <span class="badge-core">[CORE PUBLICATION SERVICE]</span>
          <span style="color: var(--text-muted);">{{ collections.posts[0].date | postDate }} LAST SYNC</span>
        </div>

        <a href="/dispatches/" class="blog-feature-title">&gt; Technical Notes &amp; Engineering Dispatches</a>
        <p class="blog-feature-desc">
          Notes from my Journey building out interconnected systems.
        </p>

        <div class="blog-sublinks">
          {% for post in collections.posts | limit(4) %}
            <a href="{{ post.url }}" class="blog-sublink-item">
              <span>{{ loop.index }}. {{ post.data.title }}</span>
              <span style="color: var(--accent-cyan);">[{{ post.templateContent | readingTime(post.data.readingTime) }}] &rarr;</span>
            </a>
          {% endfor %}
        </div>
      </div>
    </section>
  </div>

  <!-- Right Column: Homelab Hosted Services & Node Telemetry -->
  <div style="display: flex; flex-direction: column; gap: var(--tile-gap);">
    <section class="tile" aria-label="Homelab Services Directory">
      <header class="tile-header">
        <div class="tile-title">
          <span class="status-indicator"></span>
          // HOMELAB SERVICES ROUTER
        </div>
        <span class="tile-meta">{{ site.services.length }} PUBLIC TOOLS</span>
      </header>

      <div class="services-mini-grid">
        {% for svc in site.services %}
          <a href="{{ svc.url }}" target="_blank" rel="noopener noreferrer" class="service-tile-item">
            <div>
              <div class="service-item-title">{{ svc.name }}</div>
              <div class="service-item-tag">{{ svc.tag }}</div>
            </div>
            <p class="service-item-desc">{{ svc.desc }}</p>
          </a>
        {% endfor %}
      </div>
    </section>

    <!-- Infrastructure Telemetry Tile -->
    <section class="tile" aria-label="Infrastructure Nodes Telemetry">
      <header class="tile-header">
        <div class="tile-title">
          <span class="status-indicator"></span>
          // CLUSTER TELEMETRY
        </div>
        <span class="tile-meta">3 NODES ONLINE</span>
      </header>

      <div style="display: flex; flex-direction: column; gap: 8px;">
        <div class="node-stat-row">
          <span class="node-name">NODE-01 (Primary Cluster)</span>
          <span class="node-load">ONLINE &bull; LOAD: 0.18</span>
        </div>
        <div class="node-stat-row">
          <span class="node-name">NODE-02 (Storage Array)</span>
          <span class="node-load">ONLINE &bull; POOL: 98% HEALTH</span>
        </div>
        <div class="node-stat-row">
          <span class="node-name">GATEWAY-01 (Edge Ingress)</span>
          <span class="node-load">ONLINE &bull; ROUTING ACTIVE</span>
        </div>
      </div>
    </section>
  </div>
</div>