🧠 Day 9 of 21days challenge JavaScript Event Delegation 🔥 Instead of adding event listeners to every child, we attach a single listener to the parent. It handles events of all child elements efficiently. For easy understanding :- Event Delegation = parent handles children’s events Avoids multiple listeners Improves performance 👉 That’s why parent element manages all child clicks This changed how I optimize DOM events 🚀 #JavaScript #EventDelegation #Frontend

building daily with Access Denied Built a Tic Tac Toe game using JavaScript today. this one was more challenging than expected because the main task was managing the game logic properly: tracking turns, checking winning conditions, and making sure the board updates correctly after each move. felt nice seeing everything work together instead of just writing isolated pieces of code. Slowly getting more comfortable with how JavaScript controls behaviour on a webpage instead of just styling it. More projects coming soon... github link in comments. #javascript #buildinpublic #webdevelopment #learning #codingjourney

💥 Day 78 – DOM Toggle Magic ✨ Today I unlocked the power of toggle in JavaScript DOM — a simple yet impactful way to control element visibility and interactivity. - Practiced how classList.toggle() can add or remove classes dynamically. - Explored how toggling helps in building interactive features like dropdowns, modals, and dark/light themes. - Strengthened my understanding of DOM manipulation, event handling, and how small changes can create big user experiences. 🌱 Reflection – Toggle is more than a function; it’s a mindset. It teaches flexibility — the ability to switch states seamlessly, just like how we adapt in coding and in life. ⚡ Day 78 was about learning how a single function can transform static pages into dynamic, responsive interfaces. #Day78 #JavaScript #DOM #Toggle #CodingJourney #10000Coders #LearnInPublic #100DaysOfCode

Day 1 of #100DaysOfJavaScript 🚀 Today I built a simple Counter App using JavaScript. 🔧 Features: • Increment the number • Decrement the number • Reset back to zero 📚 What I learned: • DOM manipulation • Handling button click events • Updating UI dynamically with JavaScript ⚡ Challenges: Understanding how to properly update values in the DOM without refreshing the page. 🎯 Goal for tomorrow: Build another small interactive project and improve logic building. Starting small, but staying consistent 💪 #JavaScript #100DaysOfCode #WebDevelopment #CodingJourney #LearnInPublic

🚨 Events and Event Listeners are NOT the same. This completely changed how I understand JavaScript. Earlier I thought events and event listeners were the same thing. But they’re not. 👉 Events happen all the time — clicks, mouse movements, scrolling… 👉 Event listeners decide what to do when those events occur What I learned: • Events are constantly happening in the browser • Event listeners react to those events using addEventListener() element.addEventListener("click", handler, false); The most interesting part: Event Flow Every event goes through 3 phases: 1️⃣ Capture phase (top → target) 2️⃣ Target phase 3️⃣ Bubbling phase (target → top) Event Bubbling If you click a child element: 👉 The event doesn't stop there 👉 It bubbles up through parent elements Capture vs Bubbling • Default (false) → runs during bubbling phase • true → runs during capture phase Important: 👉 Setting true does NOT stop bubbling 👉 To stop propagation, we use event.stopPropagation() Key takeaway: Events are not random behavior — they follow a structured propagation system inside the DOM. Understanding this makes DOM handling much more predictable. Shared a detailed diagram below for better understanding of event propogation in JavaScript. Course Instructor: Rohit Negi | Youtube Channel: CoderArmy #JavaScript #WebDevelopment #DOM #LearningJourney #BuildInPublic #fullstackdevelopment

When working on our real-time game project (ft_transcendence), my team and I peppered our code with setTimeout, requestAnimationFrame and a lot of async / await. They all looked like different flavours of 'async'; they all 'ran later'. I assumed they must behave differently (why else would they all exist?), but I didn't really know how or why. So I looked into it, trying to build a mental model about what actually happens in the browser. Once that clicked, these mechanisms became easier to reason about and a lot of previously confusing behavior stopped being surprising. I've documented this process into a series: - Why nothing can interrupt synchronous execution - What a “task” actually is - Why promises always run first - And most recently: what async / await really does I’ve put everything together here: https://lnkd.in/dG_Gy3Fn Still more articles to come! Also - what’s one async behavior in JavaScript that confused you the most?

🚀 Just built a Number Guessing Game using JavaScript! This project helped me practice: ✅ DOM Manipulation ✅ Event Handling (click & Enter key) ✅ Conditional Logic ✅ Game State Management 🎮 Features: - Random number between 1–100 - Limited attempts - Feedback (Too High / Too Low) - Win counter & restart option I’m currently improving my JavaScript skills and building small projects daily to get better 🚀 Next step: Moving towards React and building more interactive apps! 💻 Feedback is welcome 🙌 #JavaScript #WebDevelopment #Frontend #CodingJourney #100DaysOfCode

Built a simple Tenzies game using React 🎲 This project is part of my ongoing learning journey with the Scrimba React course, and it helped me practice some important concepts like: • Components • Props • State • useEffect • useRef • Event handling • Conditional rendering • Basic accessibility GitHub: https://lnkd.in/d8AZF-TX Live Demo: https://lnkd.in/dJ9k5T8E Enjoy the game!🎮 Next surprise project is already cooking: AI Chef 😉👨🍳🤖 #ReactJS #JavaScript #FrontendDevelopment #Scrimba #LearningByBuilding

Ever wondered how JavaScript handles all those asynchronous tasks without freezing up? 🤔 It's all thanks to the magical event loop! This clever mechanism keeps things running smoothly behind the scenes. Think of it like a tireless waiter at a busy restaurant, constantly checking on your requests. ☕️ The call stack handles immediate tasks, while the callback queue waits for those async operations to finish. Then, the event loop zips them back into the call stack for processing! It's a beautiful dance that keeps your web pages interactive. 🕺💃 #JavaScript #EventLoop #WebDevelopment #Coding

Recently, taught Redux, a powerful JavaScript library used for global state management in modern applications. 💡 Key Concepts Covered: 1. Understanding what Redux is and why it is used 2. Core building blocks: Reducer, Action, and Initial State 3. How reducers process actions and update the state 4. How the store maintains and manages the global state 5. How the UI interacts using useSelector and useDispatch 🧠 Deep Dive Learnings: 1. Explained in detail what a reducer function is and how it works internally Introduced Redux Toolkit (@reduxjs/toolkit), where creating and configuring a slice automatically generates reducer logic 2. Understood how react-redux bindings provide hooks like useDispatch to dispatch actions and useSelector to access state Below is the diagram from the session conducted #Redux #ReactJS #JavaScript #StateManagement #WebDevelopment #Learning #CodingJourney #TechEducation