ertuncozbay.dev/welcome-to-my-workshop-note.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Why I Built This Personal Workshop & Learning Notebook — Blog — Ertunç Özbay</title>
  <meta name="description" content="Starter note explaining why Ertunç Özbay built a static workshop notebook for hardware, software, and open-source learning.">
  <link rel="icon" type="image/svg+xml" href="../assets/images/favicon.svg">
  <link rel="stylesheet" href="../assets/css/style.css">
</head>
<body>
  <a class="skip-link" href="#main-content">Skip to main content</a>

  <header class="site-header">
    <div class="container header-inner">
      <a class="site-brand" href="../index.html">
        <span class="brand-mark" aria-hidden="true">EÖ</span>
        <span>
          Ertunç Özbay
          <span class="brand-subtitle">workshop // notebook // lab</span>
        </span>
      </a>

      <button class="nav-toggle" type="button" data-nav-toggle aria-expanded="false" aria-controls="primary-navigation">
        <span aria-hidden="true">☰</span>
        <span data-nav-label>Menu</span>
      </button>

      <nav id="primary-navigation" class="site-nav" data-site-nav aria-label="Main navigation">
        <ul class="nav-list">
            <li><a class="nav-link" href="../index.html">Home</a></li>
            <li><a class="nav-link" href="../about.html">About</a></li>
            <li><a class="nav-link" href="../projects/index.html">Projects</a></li>
            <li><a class="nav-link" href="../blog/index.html" aria-current="page">Blog</a></li>
            <li><a class="nav-link" href="../lab.html">Lab</a></li>
            <li><a class="nav-link" href="../contact.html">Contact</a></li>
        </ul>
      </nav>
    </div>
  </header>

  <main id="main-content">
    <div class="container">
      <nav class="breadcrumb" aria-label="Breadcrumb">
        <a href="index.html">← Back to Blog</a>
      </nav>

      <article class="reading-width">
        <header class="workshop-hero">
          <div class="card-meta">
            <span class="badge badge-draft">Example • Starter Note</span>
            <time datetime="2026-10-14">October 14, 2026</time>
            <span>• Category: Personal Learning Reflections</span>
            <span>• Reading time: 3 min read</span>
          </div>
          <h1>Why I Built This Personal Workshop &amp; Learning Notebook</h1>
          <p class="hero-lead">
            A short starter note on why I want my website to feel like an open engineering workbench rather than a polished corporate résumé.
          </p>
          <ul class="tag-list" aria-label="Article tags">
            <li><span class="tag">workshop</span></li>
            <li><span class="tag">hardware-software</span></li>
            <li><span class="tag">open-source</span></li>
            <li><span class="tag">learning-in-public</span></li>
          </ul>
        </header>

        <section class="section-block" aria-labelledby="note-sec-1">
          <h2 id="note-sec-1">Starting With Curiosity Instead of Pretending to Know Everything</h2>
          <p>
            When people build personal websites, it is easy to fall into the trap of trying to sound like a large company or a finished expert. I wanted the exact opposite. I am a student studying Electrical and Electronics Engineering, and what makes my journey exciting to me is what I am currently learning, testing, and figuring out.
          </p>
          <p>
            I built this static site on GitHub Pages with plain HTML, CSS, and JavaScript so that I can understand every file in the repository and maintain it myself without a complex backend or framework getting in the way.
          </p>
        </section>

        <section class="section-block" aria-labelledby="note-sec-2">
          <h2 id="note-sec-2">Hardware, Software, and Responsibility</h2>
          <p>
            Whether I am working on my <a href="../projects/midi-breadboard-instrument.html">MIDI Breadboard Instrument</a>, my <a href="../projects/multi-functional-controller.html">Multi-Functional RC Controller</a>, or my <a href="../projects/rc-autonomous-vehicle.html">RC and Autonomous Vehicle</a> project, my goal is to understand how the physical circuit and the code interact.
          </p>
          <p>
            Just like understanding a car’s steering, brakes, and dynamics makes you a more responsible driver, understanding both hardware and software helps me ask better questions, evaluate AI output critically, spot mistakes, and take responsibility for what I build.
          </p>
        </section>

        <section class="section-block" aria-labelledby="note-sec-3">
          <h2 id="note-sec-3">Related Projects</h2>
          <ul>
            <li><a href="../projects/multi-functional-controller.html">Multi-Functional RC Controller</a> (In progress)</li>
            <li><a href="../projects/rc-autonomous-vehicle.html">RC and Autonomous Vehicle</a> (In progress)</li>
            <li><a href="../projects/midi-breadboard-instrument.html">MIDI Breadboard Instrument</a> (In progress / Experimental)</li>
          </ul>
          <div class="button-row">
            <a class="btn btn-secondary" href="index.html">← Back to Blog Index</a>
          </div>
        </section>
      </article>

    </div>
  </main>

  <footer class="site-footer">
    <div class="container footer-inner">
      <div>
        <strong>Ertunç Özbay</strong> — Personal workshop, project lab, and learning notebook.
      </div>
      <ul class="footer-links" aria-label="Footer links">
        <li><a href="../projects/index.html">Projects</a></li>
        <li><a href="../blog/index.html">Blog</a></li>
        <li><a href="../lab.html">Lab</a></li>
        <li><a href="../contact.html">Contact</a></li>
        <li><a href="https://github.com/ertunc-ozbay" rel="noopener noreferrer">GitHub</a></li>
      </ul>
    </div>
  </footer>

  <script src="../assets/js/main.js"></script>
</body>
</html>