index.html

---
layout: default
title: Home
---
<script src="assets/js/site.js" defer></script>
  <div class="notebook">
  <section id="about" class="paper">
    <h2>Welcome to My GitHub Pages Site</h2>
    <p>Hello! I'm Guy, a computer science researcher at the University of Washington. I enjoy working on distributed systems, algorithms, and optimization problems.</p>
  </section>

  <section id="skills" class="paper">
    <h2>Skills</h2>
    <div class="skills-grid">
      <div class="skill-category">
        <div class="skill-category-header">
          <div class="skill-icon" id="icon-languages"></div>
          <h3>Languages</h3>
        </div>
        <ul>
          <li>Python</li>
          <li>JavaScript</li>
          <li>TypeScript</li>
          <li>SQL</li>
          <li>Java</li>
          <li>C <- best one</li>
          <li>C++</li>
        </ul>
      </div>
      <div class="skill-category">
        <div class="skill-category-header">
          <div class="skill-icon" id="icon-frontend"></div>
          <h3>Frontend</h3>
        </div>
        <ul>
          <li>React</li>
          <li>Tailwind</li>
          <li>HTML</li>
          <li>CSS</li>
        </ul>
      </div>
      <div class="skill-category">
        <div class="skill-category-header">
          <div class="skill-icon" id="icon-backend"></div>
          <h3>Backend & APIs</h3>
        </div>
        <ul>
          <li>Node.js</li>
          <li>Express</li>
          <li>Flask</li>
          <li>Springboot</li>
          <li>FastAPI</li>
          <li>GraphQL</li>
        </ul>
      </div>
      <div class="skill-category">
        <div class="skill-category-header">
          <div class="skill-icon" id="icon-data"></div>
          <h3>Data</h3>
        </div>
        <ul>
          <li>SQLite</li>
          <li>Postgres</li>
          <li>MongoDB</li>
          <li>Kafka</li>
        </ul>
      </div>
      <div class="skill-category">
        <div class="skill-category-header">
          <div class="skill-icon" id="icon-cloud"></div>
          <h3>Cloud/DevOps</h3>
        </div>
        <ul>
          <li>AWS</li>
          <li>Azure</li>
          <li>GCP</li>
          <li>Docker</li>
          <li>MultiPaxos</li>
        </ul>
      </div>
      <div class="skill-category">
        <div class="skill-category-header">
          <div class="skill-icon" id="icon-ai"></div>
          <h3>AI/ML</h3>
        </div>
        <ul>
          <li>PyTorch</li>
          <li>NumPy</li>
          <li>Matplotlib</li>
          <li>LangGraph</li>
          <li>CrewAI</li>
        </ul>
      </div>
    </div>
  </section>

  <!-- <section id="car-break" class="car-container">
    <div class="toy-car">
      <svg viewBox="0 0 120 70" xmlns="http://www.w3.org/2000/svg">
  
        <path d="M 15 35 Q 14 34 15 33 L 18 33 Q 19 32 20 33 L 30 33 Q 31 32 32 33 L 32 20 Q 31 19 32 18 L 40 18 Q 41 17 42 18 L 70 18 Q 71 17 72 18 L 72 33 Q 73 32 74 33 L 85 33 Q 86 32 87 33 L 90 33 Q 91 34 90 35 L 90 45 Q 91 46 90 47 L 15 47 Q 14 46 15 45 Z" 
              fill="#ff6b6b" 
              stroke="#2b2b2b" 
              stroke-width="2.5" 
              stroke-linecap="round" 
              stroke-linejoin="round"/>
        

        <path d="M 38 23 Q 37 22 38 21 L 50 21 Q 51 22 50 23 L 50 30 Q 51 31 50 32 L 38 32 Q 37 31 38 30 Z" 
              fill="#87ceeb" 
              stroke="#2b2b2b" 
              stroke-width="2" 
              opacity="0.7"/>
        <path d="M 55 23 Q 54 22 55 21 L 67 21 Q 68 22 67 23 L 67 30 Q 68 31 67 32 L 55 32 Q 54 31 55 30 Z" 
              fill="#87ceeb" 
              stroke="#2b2b2b" 
              stroke-width="2" 
              opacity="0.7"/>
        
 
        <g class="wheel-left" transform-origin="30 50">
          <circle cx="30" cy="50" r="10" 
                  fill="#333" 
                  stroke="#2b2b2b" 
                  stroke-width="2.5"/>
          <circle cx="30" cy="50" r="5" 
                  fill="#666" 
                  stroke="#2b2b2b" 
                  stroke-width="2"/>
          <line x1="30" y1="45" x2="30" y2="40" 
                stroke="#2b2b2b" 
                stroke-width="2" 
                stroke-linecap="round"/>
        </g>
        
        
        <g class="wheel-right" transform-origin="75 50">
          <circle cx="75" cy="50" r="10" 
                  fill="#333" 
                  stroke="#2b2b2b" 
                  stroke-width="2.5"/>
          <circle cx="75" cy="50" r="5" 
                  fill="#666" 
                  stroke="#2b2b2b" 
                  stroke-width="2"/>
          <line x1="75" y1="45" x2="75" y2="40" 
                stroke="#2b2b2b" 
                stroke-width="2" 
                stroke-linecap="round"/>
        </g>
        
  
        <circle cx="88" cy="38" r="4" 
                fill="#ffeb3b" 
                stroke="#2b2b2b" 
                stroke-width="2"/>
        
        
        <line x1="52" y1="35" x2="58" y2="35" 
              stroke="#2b2b2b" 
              stroke-width="2" 
              stroke-linecap="round"/>
      </svg>
    </div>
  </section> -->

  <section id="experience">
    <h2>My Journey</h2>
    <div class="timeline">

      <div class="timeline-item">
        <div class="timeline-date">
          <span class="date-badge">Oct. 2022 – Dec. 2022</span>
        </div>
        <div class="timeline-content">
          <div class="experience-header">
            <img src="https://inabia.com/inabia-new/wp-content/uploads/2024/10/logo-inabia-white.png" alt="Inabia" class="company-logo">
            <div>
              <h3>Data Science Intern</h3>
              <p class="company">Inabia Solutions & Consulting Inc. • Redmond, WA</p>
            </div>
          </div>
          <ul>
            <li>My first internship!</li>
            <li>Finetuned models and automated data pipelines</li>
          </ul>
        </div>
      </div>

      <div class="timeline-item">
        <div class="timeline-date">
          <span class="date-badge">Jun. 2023</span>
        </div>
        <div class="timeline-content">
          <div class="experience-header">
            <img src="https://www.bellevuecollege.edu/wp-content/uploads/sites/23/2019/12/PRI_BC_Bulldog-Head_CMYK.png" alt="BC" class="company-logo">
            <div>
              <h3>Running Start</h3>
              <p class="company">Bellevue College • Bellevue, WA</p>
            </div>
          </div>
          <ul>
            <li>Finished my last class at my favorite school :(</li>
          </ul>
        </div>
      </div>

       <div class="timeline-item">
        <div class="timeline-date">
          <span class="date-badge">Sep. 2023</span>
        </div>
        <div class="timeline-content">
          <div class="experience-header">
            <img src="https://upload.wikimedia.org/wikipedia/commons/1/17/Washington_Huskies_logo.svg" alt="UW" class="company-logo">
            <div>
              <h3>Starting my undergrad journey</h3>
              <p class="company">University of Washington • Seattle, WA</p>
            </div>
          </div>
          <ul>
            <li>Took my first CS classes at UW: Discrete Math and Hardware & Software Interface</li>
          </ul>
        </div>
      </div>

      <div class="timeline-item">
        <div class="timeline-date">
          <span class="date-badge">Oct. 2024 – Nov. 2024</span>
        </div>
        <div class="timeline-content">
          <div class="experience-header">
            <img src="https://upload.wikimedia.org/wikipedia/commons/1/17/Washington_Huskies_logo.svg" alt="UW" class="company-logo">
            <div>
              <h3>Mentor</h3>
              <p class="company">CSEED Buildspace @ UW • Seattle, WA</p>
            </div>
          </div>
          <ul>
            <li>Helped students build cool stuff :)</li>
          </ul>
        </div>
      </div>

      <div class="timeline-item">
        <div class="timeline-date">
          <span class="date-badge">Sep. 2024 – Dec. 2024</span>
        </div>
        <div class="timeline-content">
          <div class="experience-header">
            <img src="https://appexchange.salesforce.com/image_host/2170dced-8905-4f5c-8595-5cf3d38fbee4.png" alt="Worknet" class="company-logo">
            <div>
              <h3>Software Engineer Intern</h3>
              <p class="company">Worknet • Seattle, WA</p>
            </div>
          </div>
          <ul>
            <li>Developed agent chatbots for customer support</li>
          </ul>
        </div>
      </div>

      <div class="timeline-item">
        <div class="timeline-date">
          <span class="date-badge">Dec. 2024 – Jun. 2025</span>
        </div>
        <div class="timeline-content">
          <div class="experience-header">
            <img src="https://upload.wikimedia.org/wikipedia/commons/1/17/Washington_Huskies_logo.svg" alt="UW" class="company-logo">
            <div>
              <h3>Research Assistant</h3>
              <p class="company">Programmable Matter Lab, University of Washington • Seattle, WA</p>
            </div>
          </div>
          <ul>
            <li>Created Block, a Python library for visualizing and evaluating magnetic configurations for programmable materials research.</li>
      
          </ul>
        </div>
      </div>

      <div class="timeline-item">
        <div class="timeline-date">
          <span class="date-badge">Jun. 2025 – Aug. 2025</span>
        </div>
        <div class="timeline-content">
          <div class="experience-header">
            <img src="https://upload.wikimedia.org/wikipedia/commons/3/3b/Expedia_Logo_2023.svg" alt="Expedia" class="company-logo">
            <div>
              <h3>Data Engineer Intern</h3>
              <p class="company">Expedia Group • Seattle, WA</p>
            </div>
          </div>
          <ul>
            <li>Developed notification service for real-time workforce metrics</li>
          </ul>
        </div>
      </div>

      <div class="timeline-item">
        <div class="timeline-date">
          <span class="date-badge">Dec. 2025</span>
        </div>
        <div class="timeline-content">
          <div class="experience-header">
            <img src="https://upload.wikimedia.org/wikipedia/commons/1/17/Washington_Huskies_logo.svg" alt="UW" class="company-logo">
            <div>
              <h3>Graduation</h3>
              <p class="company">University of Washington • Seattle, WA</p>
            </div>
          </div>
          <ul>
            <li>Completed my Bachelor's degree in Computer Science</li>
            <li>Finished my last class ever as an undergrad, CSE 452 Distributed Systems :0</li>
          </ul>
        </div>
      </div>

      <div class="timeline-item">
        <div class="timeline-date">
          <span class="date-badge">Aug. 2026 - Present</span>
        </div>
        <div class="timeline-content">
          <div class="experience-header">
            <img src="https://upload.wikimedia.org/wikipedia/commons/3/3b/Expedia_Logo_2023.svg" alt="Expedia" class="company-logo">
            <div>
              <h3>Data Engineer</h3>
              <p class="company">Expedia Group • Seattle, WA</p>
            </div>
          </div>
          <ul>
            <li>;)</li>
          </ul>
        </div>
      </div>

    </div>
  </section>

  <section id="facts" class="card paper">
    <h2>Some facts from me:</h2>
  </section>

     <section id="seattle-weather" class="card paper">
    <h2>Weather in Seattle</h2>
    <div id="weather-status">Loading latest hourly forecast...</div>
    <div id="weather-list"></div>
  </section>

  <section id="seattle-time" class="card paper">
    <h2>local time in Seattle</h2>
    <div id="time-display" style="font-size: 2rem; text-align: center; font-family: 'Inconsolata', monospace;"></div>
  </section>

  <section id="dad-joke" class="card paper" style="position: relative;">
    <h2>Dad Joke of the Moment</h2>
    <div id="joke-status">Loading joke...</div>
    <div id="joke-text" style="font-family: 'Inconsolata', monospace; font-size: 1.2rem; margin: 1.5rem 0; line-height: 1.6;"></div>
    <div id="new-joke-btn" style="position: absolute; bottom: 1rem; right: 1rem; cursor: pointer; width: 36px; height: 36px; transition: transform 0.3s ease;" title="Get new joke">
      <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg" style="width: 100%; height: 100%;">
        <path d="M 50 20 C 65 20 78 33 78 48 C 78 63 65 76 50 76" 
              stroke="#2b2b2b" 
              stroke-width="4" 
              stroke-linecap="round" 
              fill="none"/>
        <path d="M 50 76 C 35 76 22 63 22 48 C 22 33 35 20 50 20" 
              stroke="#2b2b2b" 
              stroke-width="4" 
              stroke-linecap="round" 
              stroke-dasharray="4 4"
              fill="none"/>
        <path d="M 50 15 L 50 25 M 50 15 L 56 21" 
              stroke="#2b2b2b" 
              stroke-width="3.5" 
              stroke-linecap="round"/>
        <path d="M 50 81 L 50 71 M 50 81 L 44 75" 
              stroke="#2b2b2b" 
              stroke-width="3.5" 
              stroke-linecap="round"/>
      </svg>
    </div>
  </section>

  
    <section id="social-links">
    <h2>Connect with Me</h2>
    <div class="social-links-container">
      <a href="https://github.com/guyco3" class="social-icon"><i class="fab fa-github"></i></a>
      <a href="https://www.linkedin.com/in/guy-cohen12" class="social-icon"><i class="fab fa-linkedin"></i></a>
      <a href="https://medium.com/@gcohen.dev" class="social-icon"><i class="fab fa-medium-m"></i></a>
    </div>
  </section>

  </div>