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

<!DOCTYPE html>
<html lang="en" data-theme="colorful">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Why I Built This Personal Workshop &amp; 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?v=2">
</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">embedded // hardware // open-source</span>
        </span>
      </a>

      <div class="header-controls">
        <div class="theme-switcher" role="group" aria-label="Select UI Theme">
          <button type="button" class="theme-btn" data-set-theme="colorful" aria-pressed="true">🎨 Colorful</button>
          <button type="button" class="theme-btn" data-set-theme="neon" aria-pressed="false">🌈 Neon</button>
          <button type="button" class="theme-btn" data-set-theme="blueprint" aria-pressed="false">📐 Blueprint</button>
        </div>

        <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>
    </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">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><span class="gradient-title">Why I Built This Personal Workshop &amp; Learning Notebook</span></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 tag-esp">workshop</span></li>
            <li><span class="tag tag-c">hardware-software</span></li>
            <li><span class="tag tag-hw">open-source</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 and self-hosted this static site on my own Linux cloud server 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>
        </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 (ESP32-S3)</a></li>
            <li><a href="../projects/midi-breadboard-instrument.html">MIDI Breadboard Instrument (ESP32 Dual-Core)</a></li>
            <li><a href="../projects/rc-autonomous-vehicle.html">RC and Autonomous 4WD Vehicle</a></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> — Electrical &amp; Electronics Engineering Student • <a href="mailto:ertunc.ozbay@outlook.com">ertunc.ozbay@outlook.com</a>
      </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://git.ertuncozbay.dev/ertunc-ozbay" rel="noopener noreferrer">Git Server</a></li>
        <li><a href="https://www.linkedin.com/in/ertunc-ozbay" rel="noopener noreferrer">LinkedIn</a></li>
      </ul>
    </div>
  </footer>

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