<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"><channel><title><![CDATA[Dipesh Sapkota Blogs]]></title><description><![CDATA[Read technical build logs, engineering articles, and software deep-dives by Dipesh Sapkota, a Computer Engineering student at IOE Thapathali Campus.]]></description><link>https://how-i-built-an-interactive-git-visualizer.hashnode.dev</link><image><url>https://cdn.hashnode.com/uploads/logos/6abe76283e92053997c1bf04/3538b22d-02e7-42a8-a4ac-690a937e96ce.webp</url><title>Dipesh Sapkota Blogs</title><link>https://how-i-built-an-interactive-git-visualizer.hashnode.dev</link></image><generator>RSS for Node</generator><lastBuildDate>Thu, 08 Oct 2026 06:40:23 GMT</lastBuildDate><atom:link href="https://how-i-built-an-interactive-git-visualizer.hashnode.dev/rss.xml" rel="self" type="application/rss+xml"/><language><![CDATA[en]]></language><ttl>60</ttl><item><title><![CDATA[Building an IoT-Based Emergency Response System with ESP32]]></title><description><![CDATA[By Dipesh Sapkota
As a Computer Engineering student at IOE Thapathali Campus, my work often bridges the gap between software logic and physical hardware. While building web applications and visualizer]]></description><link>https://how-i-built-an-interactive-git-visualizer.hashnode.dev/building-an-iot-based-emergency-response-system-with-esp32</link><guid isPermaLink="true">https://how-i-built-an-interactive-git-visualizer.hashnode.dev/building-an-iot-based-emergency-response-system-with-esp32</guid><category><![CDATA[dipeshsapkota]]></category><category><![CDATA[DI]]></category><category><![CDATA[sapkotadipesh]]></category><category><![CDATA[dszae]]></category><dc:creator><![CDATA[Dipesh Sapkota]]></dc:creator><pubDate>Thu, 01 Oct 2026 15:39:29 GMT</pubDate><content:encoded><![CDATA[<p><strong>By Dipesh Sapkota</strong></p>
<p>As a Computer Engineering student at <strong>IOE Thapathali Campus</strong>, my work often bridges the gap between software logic and physical hardware. While building web applications and visualizers is exciting, engineering physical solutions that can impact real-world safety brings a completely different level of fulfillment.</p>
<p>For one of my core hardware engineering projects, I designed and developed an <strong>IoT-Based Emergency Response System for the Elderly</strong>, powered by an <strong>ESP32 microcontroller</strong>, integrated motion and biopotential sensors, and a custom-fabricated printed circuit board (PCB).</p>
<h2>The Problem It Solves</h2>
<p>Traditional emergency response systems for elderly or vulnerable individuals often rely on manual triggers or stationary panic buttons, which may not be accessible if a fall or medical emergency occurs suddenly.</p>
<p>The goal of this project was to build an automated, low-latency, and reliable IoT alert system that:</p>
<ul>
<li><p><strong>Detects Anomalies Quickly:</strong> Uses motion sensors and biometric tracking to identify sudden changes or distress events.</p>
</li>
<li><p><strong>Triggers Immediate Alerts:</strong> Automatically transmits distress signals over Wi-Fi via an ESP32 microcontroller to notify designated caregivers or emergency contacts.</p>
</li>
<li><p><strong>Ensures Hardware Reliability:</strong> Integrates a custom-designed PCB layout to keep components compact, stable, and resilient against power noise.</p>
</li>
</ul>
<h2>Hardware Architecture &amp; Tech Stack</h2>
<p>Bringing this system to life required combining embedded C++ firmware with physical circuit design:</p>
<ul>
<li><p><strong>Microcontroller Core:</strong> <strong>ESP32</strong>, chosen for its integrated Wi-Fi capabilities, dual-core processing, and low power consumption.</p>
</li>
<li><p><strong>Sensor Integration:</strong> Motion sensors and biopotential monitoring modules wired to capture real-time physical telemetry.</p>
</li>
<li><p><strong>Circuit Design &amp; Prototyping:</strong> Designed schemas and simulated layouts using industry-standard tools before moving to custom PCB fabrication.</p>
</li>
<li><p><strong>Firmware Development:</strong> Written in <strong>C++</strong>, handling sensor polling, interrupt routines, and network requests to dispatch emergency alerts instantly.</p>
</li>
</ul>
<h2>Key Engineering Takeaways</h2>
<ul>
<li><p><strong>Handling Hardware-Software Interfacing:</strong> Debugging sensor signals taught me the importance of hardware debouncing, clean power regulation, and managing asynchronous interrupts on microcontrollers.</p>
</li>
<li><p><strong>PCB Fabrication Challenges:</strong> Moving from a breadboard prototype to a custom printed circuit board required rigorous trace routing to minimize signal interference and ensure structural longevity.</p>
</li>
</ul>
<h2>Explore More &amp; Connect</h2>
<p>You can read more about my engineering projects and web tools on my main portfolio:<br />👉 <a href="https://www.dipeshsapkota7.com.np/"><strong>Visit Dipesh Sapkota's Portfolio</strong></a><br />💻 Check out my code and repository archives on my <a href="https://github.com/dszae"><strong>GitHub Profile</strong></a>.</p>
<hr />
<p><strong>About the Author:</strong><br />Dipesh Sapkota is a Computer Engineering student at IOE Thapathali Campus in Nepal, an AI/ML enthusiast, and a maker bridging embedded hardware systems with full-stack software development. Connect with him on <a href="https://linkedin.com/in/dszae"><strong>LinkedIn</strong></a>.</p>
]]></content:encoded></item><item><title><![CDATA[Building Sportivo: How I Engineered a Real-Time Live Sports Streaming Web App]]></title><description><![CDATA[By Dipesh Sapkota
As a Computer Engineering student at IOE Thapathali Campus, I am constantly exploring how to bridge the gap between robust software architecture and lightning-fast user interfaces. W]]></description><link>https://how-i-built-an-interactive-git-visualizer.hashnode.dev/building-sportivo-live-sports-streaming</link><guid isPermaLink="true">https://how-i-built-an-interactive-git-visualizer.hashnode.dev/building-sportivo-live-sports-streaming</guid><category><![CDATA[dipesh_sapkota]]></category><category><![CDATA[dipeshsapkota]]></category><category><![CDATA[dipesh]]></category><category><![CDATA[s]]></category><dc:creator><![CDATA[Dipesh Sapkota]]></dc:creator><pubDate>Thu, 01 Oct 2026 15:24:12 GMT</pubDate><content:encoded><![CDATA[<p><strong>By Dipesh Sapkota</strong></p>
<p>As a Computer Engineering student at <strong>IOE Thapathali Campus</strong>, I am constantly exploring how to bridge the gap between robust software architecture and lightning-fast user interfaces. When handling live content and real-time data feeds, performance and reliability are everything.</p>
<p>To solve the friction of tracking multiple live matches across different platforms, I designed and developed <a href="https://sportivo.dipeshsapkota7.com.np/"><strong>Sportivo</strong></a>, a high-performance live sports streaming web application built for seamless match discovery and playback.</p>
<h2>The Problem Sportivo Solves</h2>
<p>If you are a sports enthusiast trying to follow live football, cricket, or basketball fixtures, you are usually met with cluttered streaming sites, intrusive ads, and broken links.</p>
<p>I wanted to build a clean, distraction-free platform focused on three core pillars:</p>
<ul>
<li><p><strong>Real-Time Match Scraping:</strong> Aggregating fixtures dynamically so users can instantly find ongoing or upcoming events.</p>
</li>
<li><p><strong>Multi-Server Stream Switching:</strong> Providing fallback video sources and server toggles to ensure uninterrupted playback.</p>
</li>
<li><p><strong>Instant Match Search:</strong> Allowing users to filter streams instantly without page reloads.</p>
</li>
</ul>
<h2>Core Architecture &amp; Tech Stack</h2>
<p>To keep the application blazing fast and responsive, I built Sportivo using a modern web stack:</p>
<ul>
<li><p><strong>Frontend Architecture:</strong> Developed using <strong>React and Vite</strong>, ensuring optimal client-side rendering speed and modular component design.</p>
</li>
<li><p><strong>Styling &amp; UI:</strong> Designed with <strong>Tailwind CSS</strong> to maintain a sleek, modern dark-mode interface with zero layout shifts.</p>
</li>
<li><p><strong>Performance &amp; Deployment:</strong> Hosted seamlessly on <strong>Vercel</strong> with custom domain routing (<code>sportivo.dipeshsapkota7.com.np</code>), leveraging edge caching for rapid global delivery.</p>
</li>
</ul>
<h2>Key Takeaways from the Build</h2>
<ul>
<li><p><strong>Graceful Error Handling &amp; Fallbacks:</strong> Implementing a multi-server switching mechanism taught me a lot about handling unreliable video streams and network dropouts gracefully.</p>
</li>
<li><p><strong>Modular State Management:</strong> Keeping UI filters and search queries reactive required clean component state design to maintain a zero-latency experience.</p>
</li>
</ul>
<h2>Try It Out &amp; Connect</h2>
<p>You can test out the live platform directly here: 👉 <a href="https://sportivo.dipeshsapkota7.com.np/"><strong>Launch Sportivo Live Hub</strong></a><br />💻 Explore the open-source repository and source code on my <a href="https://github.com/dszae/sportivo"><strong>GitHub Profile</strong></a>.</p>
<hr />
<p><strong>About the Author:</strong><br />Dipesh Sapkota is a Computer Engineering student at IOE Thapathali Campus in Nepal, an AI/ML enthusiast, and a digital creator specializing in software development and media arts. Explore his main portfolio at <a href="https://www.dipeshsapkota7.com.np/"><strong>dipeshsapkota7.com.np</strong></a> or connect with him on <a href="https://linkedin.com/in/dszae"><strong>LinkedIn</strong></a>.</p>
]]></content:encoded></item><item><title><![CDATA[How I Built an Interactive Git Visualizer to Master Version Control]]></title><description><![CDATA[As a Computer Engineering student at IOE Thapathali Campus, version control is second nature to me now, but I vividly remember when concepts like rebasing, detached HEAD states, and staging areas felt]]></description><link>https://how-i-built-an-interactive-git-visualizer.hashnode.dev/how-i-built-an-interactive-git-visualizer-to-master-version-control</link><guid isPermaLink="true">https://how-i-built-an-interactive-git-visualizer.hashnode.dev/how-i-built-an-interactive-git-visualizer-to-master-version-control</guid><category><![CDATA[dipeshsapkota]]></category><category><![CDATA[dipesh]]></category><category><![CDATA[dszae]]></category><category><![CDATA[sapkotadipesh]]></category><dc:creator><![CDATA[Dipesh Sapkota]]></dc:creator><pubDate>Thu, 01 Oct 2026 15:18:18 GMT</pubDate><content:encoded><![CDATA[<p>As a Computer Engineering student at IOE Thapathali Campus, version control is second nature to me now, but I vividly remember when concepts like rebasing, detached HEAD states, and staging areas felt like a black box. Reading documentation or staring at command-line terminals only goes so far when you are trying to build a mental model of how Git actually manipulates commit trees under the hood.</p>
<p>To solve this—and to create a practical tool for fellow developers—I built and deployed <a href="https://git-visualizer.dipeshsapkota7.com.np/"><strong>Git Visualizer</strong></a>, an interactive, visually driven web application designed to break down Git workflows into intuitive, real-time visual states.</p>
<h2>Why Build a Visualizer?</h2>
<p>Most beginners hit a roadblock when they run into merge conflicts or accidentally mess up their commit history because text-based tutorials don't show the geometry of the branching tree.</p>
<p>I wanted to build something lightweight, highly responsive, and interactive that gives immediate visual feedback for standard operations like:</p>
<ul>
<li><p><code>git commit</code> and staging workflows</p>
</li>
<li><p>Branch creation and switching (<code>git checkout</code> / <code>git switch</code>)</p>
</li>
<li><p>Merging branches and handling history divergence</p>
</li>
<li><p>Resolving common stash issues (<code>git stash</code> and <code>git stash pop</code>)</p>
</li>
</ul>
<h2>Core Architecture &amp; Tech Stack</h2>
<p>For this project, I focused on clean component architecture and smooth state rendering using React, Vite, and Tailwind CSS.</p>
<ul>
<li><p><strong>State Management for Commit Trees:</strong> The app tracks nodes (commits) and pointers (HEAD, main, feature branches) as a dynamic data structure. Every time a command is executed in the UI, state reducers recalculate node positions and update the rendering canvas.</p>
</li>
<li><p><strong>Performance &amp; Deployment:</strong> Hosted seamlessly on Vercel with lightning-fast client-side routing, ensuring zero latency when stepping through command simulations.</p>
</li>
</ul>
<h2>Key Takeaways from the Build</h2>
<p>Building this tool reinforced several crucial lessons in web architecture:</p>
<ul>
<li><p><strong>State Immutability:</strong> Managing branching histories requires immutable state updates so that parent-child relationships between commits never break unexpectedly.</p>
</li>
<li><p><strong>UI/UX Clarity:</strong> Keeping animations minimal and purposeful ensures that users focus on what the command is doing to the branch structure rather than getting distracted by heavy graphics.</p>
</li>
</ul>
<h2>Try It Out &amp; Connect</h2>
<p>You can interact with the live tool directly here: 👉 <a href="https://git-visualizer.dipeshsapkota7.com.np/"><strong>Explore Git Visualizer</strong></a><br />💻 Check out the repository and source code on my <a href="https://github.com/dszae"><strong>GitHub Profile</strong></a>.</p>
<hr />
<p><strong>About the Author:</strong><br />Dipesh Sapkota is a Computer Engineering student at IOE Thapathali Campus in Nepal, an AI/ML enthusiast, and a digital creator specializing in technical software development and media arts. Explore his main portfolio at <a href="https://www.dipeshsapkota7.com.np/"><strong>dipeshsapkota7.com.np</strong></a> or connect with him on <a href="https://linkedin.com/in/dszae"><strong>LinkedIn</strong></a>.</p>
]]></content:encoded></item></channel></rss>