active Phase 8 · Workstation & Optimization · 6 log entries

Gary Gigabytes Website

A technical portfolio and a central hub for documenting my engineering journey.

Gary Gigabytes Website

Objective

Develop a high-performance, responsive workstation for documenting CS and Engineering projects with a focus on modularity and technical aesthetics.

Project Overview

This portfolio site serves as a central hub for documenting my engineering journey — from CS coursework at CSUMB to personal robotics and trading projects. Built with Jekyll and deployed on Google Cloud Run.

Roadmap & Development Phases

The site’s architecture has evolved through the following technical milestones:

Phase 8 In Progress · 8 Development Milestones · Platform Infrastructure Track
Phase 1 Complete

Bare HTML/CSS & DigitalOcean Nginx

Created the initial static site prototype running on a DigitalOcean droplet behind Nginx.

Phase 2 Complete

Jekyll Static Engine Integration

Integrated Jekyll 4.3 with custom layouts for blog posts, project showcases, and CSUMB courses.

Phase 3 Complete

Responsive Design & Layout Flow

Implemented fluid column layouts, card grids, and mobile-friendly navigation patterns.

Phase 4 Complete

Docker Containerization

Containerized the Jekyll build environment for deterministic local preview and cloud deployments.

Phase 5 Complete

Cloud Run Migration & CI/CD

Migrated from DigitalOcean to Google Cloud Run with Global Load Balancer, Cloudflare SSL, and automated GitHub Actions.

Phase 6 Complete

Sass Modularization & Token Architecture

Deconstructed 3,356 lines of monolithic CSS into 8 Sass partials behind a closed 16-color palette and strict geometry rules.

Phase 7 Complete

UI/UX Overhaul & Accessibility

Engineered blueprint grid visuals, Chakra Petch / Roboto Mono type pairing, skip links, and WCAG AA contrast.

Phase 8 · Active Target Active

Continuous Maintenance & Technical Documentation

Ongoing additions of interactive engineering components, quality gates (geometry, dead-CSS, htmlproofer), and research notes.

Technical Architecture

  • Static Site Generator: Jekyll with custom layouts for projects, posts, and course pages
  • Styling: Jekyll’s native Sass — a token file plus eight documented partials, a closed sixteen-colour palette, and three breakpoints reached only through a respond-to() mixin
  • Deployment: Dockerized Jekyll build, served via Google Cloud Run with a Global Load Balancer
  • CI/CD: GitHub Actions triggers Cloud Build on push
  • DNS/CDN: Cloudflare for caching and SSL

Design History

Three visual generations so far. The old ones are kept on purpose: this project exists to document the journey, and that includes what the site used to look like. The order is inferred from the navigation labels — each generation’s names were renamed into the next — rather than from a dated record.

First generation. Centered wordmark over a horizontal nav reading Hobby Projects and BSCS Portfolio, with a “Recent Updates” arrow list and quote-styled post cards.

First-generation site: a centered GGBYTES wordmark above a horizontal navigation bar

Second generation. Same centered shape, tightened type and spacing; the nav became Projects and CSUMB.

Second-generation site: centered wordmark with a refined horizontal navigation bar

Current. A left-aligned lockup with the G mark and a persistent navbar, an introduction band carrying the role kicker and headline, and a featured project hero. CSUMB became Coursework; the centered wordmark, the arrow list and the quote cards are all gone.

Project Log

6 entries
  • 2026-03-21 #gary-gigabytes

    Infrastructure Upgrade: Migrating from DigitalOcean to Google Cloud Run

    After running on a DigitalOcean droplet for some time, I made the decision to migrate this portfolio site to Google Cloud Run. This wasn’t just a technical exercise—it was driven by practical considerations around cos...
  • 2026-02-10 #gary-gigabytes

    Portfolio Overhaul: Engineering Aesthetic & Structural Integrity

    It was time for a structural evaluation. While this site has always served its purpose as a digital lab notebook, the underlying “codebase” (the CSS and HTML) had become a bit of a patchwork. Over the last few days, I...
  • 2025-04-23 #gary-gigabytes

    Jekyll

    I’ll be moving to using Jekyll to display my static pages and organize my posts. I was thinking of Node.js with express but Jekyll will do all that I need.
  • 2025-04-09 #gary-gigabytes

    Project Template

    I’ve been working on improving the structure and design of my website to make it more user-friendly and visually appealing.
  • 2025-04-01 #gary-gigabytes

    Initial Setup

    This is the initial setup for the Test Project. It includes basic configurations and layout testing.
  • 2025-03-26 #gary-gigabytes

    Tweaking Styles

    Hope y’all enjoy the website refresh! I’ve been messing with CSS styles and figuring out ways of styling this blog. I’m glad I was able to finish my little roadmap below. I think the next steps to improve the site wil...
← All projects