<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom"><channel><title>Event Handling on AI VOID</title><link>https://ai-blog.noorshomelab.dev/tags/event-handling/</link><description>Recent content in Event Handling on AI VOID</description><generator>Hugo</generator><language>en</language><lastBuildDate>Sun, 24 May 2026 00:00:00 +0000</lastBuildDate><atom:link href="https://ai-blog.noorshomelab.dev/tags/event-handling/index.xml" rel="self" type="application/rss+xml"/><item><title>Chapter 5: Event Handling: User Input and Interaction</title><link>https://ai-blog.noorshomelab.dev/ratatui-mastery-guide-2026/05-event-handling/</link><pubDate>Tue, 17 Mar 2026 00:00:00 +0000</pubDate><guid>https://ai-blog.noorshomelab.dev/ratatui-mastery-guide-2026/05-event-handling/</guid><description>&lt;h2 id="introduction"&gt;Introduction&lt;/h2&gt;
&lt;p&gt;Welcome back, future TUI master! In the previous chapters, you learned how to set up your Ratatui project and draw static (or semi-static) content to the terminal. But what&amp;rsquo;s a beautiful interface without interaction? A painting, not a program!&lt;/p&gt;
&lt;p&gt;This chapter is all about bringing your TUI to life by understanding and handling user input. We&amp;rsquo;ll dive into the world of &lt;strong&gt;event handling&lt;/strong&gt;, which is how your application listens for things like key presses, mouse clicks, and terminal resizes, and then reacts to them. This is the heart of any interactive application, whether it&amp;rsquo;s a TUI, GUI, or web app.&lt;/p&gt;</description></item><item><title>Interacting with Your UI: Actions and Event Handling</title><link>https://ai-blog.noorshomelab.dev/gpui-guide-2026/interacting-ui-actions-event-handling/</link><pubDate>Sun, 24 May 2026 00:00:00 +0000</pubDate><guid>https://ai-blog.noorshomelab.dev/gpui-guide-2026/interacting-ui-actions-event-handling/</guid><description>&lt;h2 id="interacting-with-your-ui-actions-and-event-handling"&gt;Interacting with Your UI: Actions and Event Handling&lt;/h2&gt;
&lt;p&gt;In previous chapters, you&amp;rsquo;ve mastered setting up your GPUI environment, creating windows, and displaying static content. While seeing &amp;ldquo;Hello, GPUI!&amp;rdquo; is a great start, a truly useful application needs to respond to user input. This chapter is your gateway to making your GPUI applications interactive.&lt;/p&gt;
&lt;p&gt;We&amp;rsquo;ll dive into GPUI&amp;rsquo;s powerful &lt;strong&gt;Actions and Event Handling&lt;/strong&gt; system. You&amp;rsquo;ll learn how raw user input, like keyboard presses and mouse clicks, is transformed into structured &amp;ldquo;actions&amp;rdquo; that your application understands. By the end, you&amp;rsquo;ll be able to define custom actions, dispatch them from your UI elements, and write handlers to bring your GPUI applications to life.&lt;/p&gt;</description></item><item><title>Chapter 7: UI Components and Event Handling - Building Interactive UIs</title><link>https://ai-blog.noorshomelab.dev/puter-js-mastery-2026/chapter-7-ui-components-events/</link><pubDate>Mon, 12 Jan 2026 00:00:00 +0000</pubDate><guid>https://ai-blog.noorshomelab.dev/puter-js-mastery-2026/chapter-7-ui-components-events/</guid><description>&lt;h2 id="introduction-to-interactive-uis-in-puterjs"&gt;Introduction to Interactive UIs in Puter.js&lt;/h2&gt;
&lt;p&gt;Welcome to Chapter 7! In the previous chapters, we&amp;rsquo;ve explored the fundamental building blocks of Puter.js, from understanding its core architecture to managing files and applications within its unique web-based operating system environment. You&amp;rsquo;ve learned how to create and manage windows, which serve as the primary containers for your applications.&lt;/p&gt;
&lt;p&gt;Now, it&amp;rsquo;s time to bring your applications to life by making them interactive. This chapter will dive deep into &lt;strong&gt;UI components&lt;/strong&gt; and &lt;strong&gt;event handling&lt;/strong&gt; in Puter.js. You&amp;rsquo;ll learn how to populate your windows with visual elements like buttons, text, and input fields, and crucially, how to make them respond to user actions. Without a way for users to interact, an application is just a static display. Mastering UI components and event handling is paramount to building engaging, dynamic, and truly useful Puter.js applications.&lt;/p&gt;</description></item><item><title>Chapter 8: Event Handling in React</title><link>https://ai-blog.noorshomelab.dev/react-mastery-2026/chapter-8-event-handling/</link><pubDate>Sat, 31 Jan 2026 00:00:00 +0000</pubDate><guid>https://ai-blog.noorshomelab.dev/react-mastery-2026/chapter-8-event-handling/</guid><description>&lt;h2 id="introduction-to-event-handling-in-react"&gt;Introduction to Event Handling in React&lt;/h2&gt;
&lt;p&gt;Welcome to Chapter 8! So far, you&amp;rsquo;ve learned how to build static components with JSX, manage component-specific data with state, and pass information between components using props. But what makes a web application truly come alive? It&amp;rsquo;s the ability to respond to user interactions! This is where &lt;strong&gt;event handling&lt;/strong&gt; steps in.&lt;/p&gt;
&lt;p&gt;In this chapter, we&amp;rsquo;ll dive deep into how React manages and responds to events like clicks, typing, form submissions, and more. Understanding event handling is crucial because it&amp;rsquo;s the foundation for creating dynamic, interactive user interfaces that react to what your users do. We&amp;rsquo;ll explore React&amp;rsquo;s unique &amp;ldquo;Synthetic Event System&amp;rdquo; and learn the best practices for implementing event handlers in your functional components.&lt;/p&gt;</description></item><item><title>Chapter 9: Controlled Forms &amp;amp; Input Management</title><link>https://ai-blog.noorshomelab.dev/react-mastery-2026/chapter-9-controlled-forms-input-management/</link><pubDate>Sat, 31 Jan 2026 00:00:00 +0000</pubDate><guid>https://ai-blog.noorshomelab.dev/react-mastery-2026/chapter-9-controlled-forms-input-management/</guid><description>&lt;h2 id="chapter-9-controlled-forms--input-management"&gt;Chapter 9: Controlled Forms &amp;amp; Input Management&lt;/h2&gt;
&lt;p&gt;Welcome back, future React maestro! In the previous chapters, you&amp;rsquo;ve mastered the fundamentals of building components, managing state with &lt;code&gt;useState&lt;/code&gt;, and handling simple events. Now, it&amp;rsquo;s time to tackle one of the most common and crucial aspects of almost any web application: forms!&lt;/p&gt;
&lt;p&gt;Forms are how users interact with your application, inputting data for everything from login credentials and search queries to creating new accounts and submitting feedback. Efficiently managing user input in forms is paramount for building interactive, robust, and user-friendly applications. This chapter will equip you with the knowledge and practical skills to create &amp;ldquo;controlled components,&amp;rdquo; the standard and most powerful way to handle form inputs in React.&lt;/p&gt;</description></item><item><title>Chapter 10: Advanced Event Handling and Modals</title><link>https://ai-blog.noorshomelab.dev/ratatui-mastery-guide-2026/10-advanced-events-modals/</link><pubDate>Tue, 17 Mar 2026 00:00:00 +0000</pubDate><guid>https://ai-blog.noorshomelab.dev/ratatui-mastery-guide-2026/10-advanced-events-modals/</guid><description>&lt;p&gt;Welcome back, intrepid TUI architect! In the previous chapters, you&amp;rsquo;ve mastered the fundamentals of building stunning terminal user interfaces with Ratatui. You can draw widgets, manage basic state, and respond to simple keyboard inputs. But what if your application needs to handle more than just a few key presses? What if you want to create interactive pop-ups that demand user attention, like confirmation dialogs or input forms?&lt;/p&gt;
&lt;p&gt;In this chapter, we&amp;rsquo;re going to level up your Ratatui skills by diving into &lt;strong&gt;advanced event handling&lt;/strong&gt; and implementing a common, yet powerful, UI pattern: &lt;strong&gt;modals&lt;/strong&gt;. You&amp;rsquo;ll learn how to listen for a wider array of events, manage application state for complex interactions, and overlay temporary, focused content on your main UI. This knowledge is crucial for building robust, user-friendly, and truly interactive terminal applications that feel polished and professional.&lt;/p&gt;</description></item><item><title>Chapter 13: Project: Building a Simple Task Manager</title><link>https://ai-blog.noorshomelab.dev/ratatui-mastery-guide-2026/13-project-task-manager/</link><pubDate>Tue, 17 Mar 2026 00:00:00 +0000</pubDate><guid>https://ai-blog.noorshomelab.dev/ratatui-mastery-guide-2026/13-project-task-manager/</guid><description>&lt;h2 id="introduction"&gt;Introduction&lt;/h2&gt;
&lt;p&gt;Welcome to Chapter 13! So far, we&amp;rsquo;ve explored the foundational elements of Ratatui: setting up your environment, drawing basic widgets, and handling user input. Now, it&amp;rsquo;s time to put all those pieces together and build something truly functional and interactive. In this chapter, we&amp;rsquo;re going to create a simple, yet robust, &lt;strong&gt;Terminal User Interface (TUI) Task Manager&lt;/strong&gt;.&lt;/p&gt;
&lt;p&gt;This project will serve as a practical application of the concepts we&amp;rsquo;ve covered. You&amp;rsquo;ll learn how to manage application state, handle diverse user inputs to interact with that state, and dynamically render different UI components based on the application&amp;rsquo;s current mode. Think of it as your first full Ratatui &amp;ldquo;meal&amp;rdquo; – cooking with all the ingredients you&amp;rsquo;ve gathered!&lt;/p&gt;</description></item><item><title>Chapter 14: Project: Creating a File Browser</title><link>https://ai-blog.noorshomelab.dev/ratatui-mastery-guide-2026/14-project-file-browser/</link><pubDate>Tue, 17 Mar 2026 00:00:00 +0000</pubDate><guid>https://ai-blog.noorshomelab.dev/ratatui-mastery-guide-2026/14-project-file-browser/</guid><description>&lt;h2 id="introduction"&gt;Introduction&lt;/h2&gt;
&lt;p&gt;Welcome to Chapter 14! So far, we&amp;rsquo;ve explored the foundational elements of Ratatui: drawing widgets, managing layouts, and handling basic input. Now, it&amp;rsquo;s time to bring these concepts together and build something truly useful and interactive: a terminal-based file browser.&lt;/p&gt;
&lt;p&gt;This project will challenge you to integrate multiple Ratatui features, manage application state effectively, and interact with the underlying file system. By the end of this chapter, you&amp;rsquo;ll have a functional TUI application that allows you to navigate directories, view file and folder names, and apply the principles of event-driven TUI development to a real-world scenario. Get ready to put your Ratatui skills to the test and build a practical tool!&lt;/p&gt;</description></item></channel></rss>