🚀 I recently learned and built a mini project using JavaScript DOM manipulation! In this project, I developed a dynamic user search feature that displays profile cards in real-time based on user input. Here’s what I implemented 👇 ✨ Created dynamic user cards using document.createElement() 🧩 Displayed user info (image, name, and bio) from an array 🔍 Built a live search feature with addEventListener("input") 💡 Filtered results using .filter() and .startsWith() 🚫 Added “No User Found” message when there’s no match 🎨 Used input border color feedback (red/green) for better UX 🧠 Wrote clean, structured JavaScript logic for scalability This project improved my understanding of DOM manipulation, real-time search, and frontend logic — all built using pure JavaScript 💻 A big thanks to Sheryians Coding School for the amazing learning experience! 🙌 #JavaScript #MiniProject #FrontendDevelopment #WebDevelopment #CodingJourney #LearnByBuilding #DOMManipulation

GitHub: https://lnkd.in/gemJEbhB 🔥 Project 3/20 — Modal Popup Magic! Today we’re crafting a modern, responsive modal popup using pure HTML, CSS & JavaScript. Click a button — boom, modal appears. Click outside — boom, it disappears. Smooth animations, overlay interaction, and event bubbling mastery included. Front-end fundamentals done right. Clean DOM manipulation, class toggling, UX-first thinking. 💡 Concepts: ✅ Event bubbling ✅ DOM manipulation ✅ Overlay click-to-close ✅ Modal animations 🔗 GitHub repo in bio Keep coding. Keep building. One project closer to mastery. ⚡ #javascript #frontend #webdevelopment #htmlcssjavascript  #vanillajs #modalpopup #eventbubbling #uxdesign #cssanimations  #frontendprojects #codetutorial #codingreels #webdevcommunity  #responsiveui #githubproject #100daysofcode #softwareengineering  #learntocode #webdevjourney #codewithme #frontenddeveloper  #programminglife #buildinpublic #webdesign #codeweaver #uiux

🎨 Mini Project: DOM Color Play This one started as me just playing around with the DOM, but it turned into a fun little project! 😄 I created a small interface with five boxes and three buttons — Start: begins changing each box’s color randomly every second 🌈 Stop: freezes the colors ⏸️ Clear: resets all boxes to white with black text ⚪ Built using HTML, CSS, and JavaScript, this helped me understand how setInterval(), DOM selection, and style manipulation work together in real time. Sometimes, the best learning happens when you’re just experimenting — no big goal, just curiosity and code. #WebDevelopment #JavaScript #DOM #LearningByDoing #FrontendFun

🎯 Learning DOM (Document Object Model) – The Heart of Frontend JavaScript Diving into DOM manipulation to understand how JavaScript interacts with webpages. From selecting elements to handling events and creating dynamic UI—DOM is what makes websites come alive. Key things I'm practicing: ✔ Selecting & modifying elements ✔ Handling events (click, input, scroll) ✔ Creating & removing elements dynamically ✔ Building interactive components Leveling up my frontend skills one step at a time. 🚀 #Frontend #JavaScript #DOM #WebDevelopment #LearningJourney Sheryians Coding School

🌟 Day 2 of DOM (Document Object Model) in JavaScript 🌟 Today marks the second day of my DOM learning journey, and it was filled with some really fun and interactive tasks that helped me understand how JavaScript can dynamically change the behavior of web pages 🎯 💡 Here’s what I practiced today: 🔹 Changing Background Color: I created multiple boxes and added functionality so that whenever I click on a specific box, its background color changes instantly. It helped me understand how to use event listeners and manipulate styles through JavaScript. 🔹 Counter Project: I built a simple counter app that increases, decreases, and resets numbers on button clicks. Through this, I got a clear idea of how to handle DOM events, update values, and reflect real-time changes on the screen. 🔹 Image Switch Task: Another interesting task I completed was creating a feature where one image changes to another when an event (like hover or click) occurs. This was a great way to explore image manipulation and conditional logic in the DOM. Each small project strengthened my confidence in handling the DOM and made me realize how powerful JavaScript can be when it comes to making webpages interactive ✨ I’ve uploaded all these tasks and practice files on my GitHub for reference 👇 🔗 GitHub Repository: https://lnkd.in/devrWxM3 #JavaScript #DOM #WebDevelopment #Frontend #CodingJourney #LearningInPublic #GitHub #DeveloperJourney 🚀

A New Beginning, Today marked the start of an exciting new chapter in my Front-End Development with JavaScript journey at IT Towers, Nalgonda, proudly organized by TASK . 🖥️✨ In this session, I explored the foundations of JavaScript — the powerful scripting language that brings life, logic, and interactivity to web pages. From understanding variables, data types, and operators to discovering how JavaScript seamlessly integrates with HTML and CSS, this session opened the doors to creating dynamic and intelligent web experiences. 💡 It was truly fascinating to witness how a few lines of code can transform static designs into engaging, interactive webpages. This experience showed me how JavaScript acts as the brain of modern web development, driving animations, interactions, and real-time functionality. ⚙️ 🎥 Check out the video below for a glimpse of my first day exploring JavaScript — where creativity meets code! #CodingJourney #FrontEndDevelopment #JavaScript #TASK #ITTowersNalgonda #SatishM #WebDevelopment #LearningByDoing #TechJourney #SkillDevelopment #CreativeCoding #InteractiveWebDesign #StudentJourney #CodingMotivation #InnovationThroughCode

💻 Exploring DOM in JavaScript! 🎯 Today, I continued my journey of learning and experimenting with the Document Object Model (DOM) — one of the most exciting parts of JavaScript that helps bring web pages to life! 🌐 Here are some of the amazing tasks I worked on today 👇 🔹 Simple Math Calculator ➕➖✖️➗ – created a basic calculator using DOM manipulation where I handled user input and displayed real-time results. 🔹 Show/Hide Password Feature 🔒👁️ – implemented a toggle feature to hide or reveal the password using simple JS logic. 🔹 Swapping Content Between Two Paragraphs 🔁 – learned how to dynamically exchange content between elements on a click event. 🔹 Generating Random Background Colors 🎨 – added functionality to change the background color randomly, giving a fun interactive touch to the webpage. Each of these tasks helped me understand DOM events, element selection, and manipulation more deeply and improved my problem-solving and logic-building skills in JavaScript. 🚀 You can check out all my DOM tasks here on my GitHub 👇 🔗https://lnkd.in/dAhB6gjM #JavaScript #DOM #WebDevelopment #LearningJourney #FrontendDevelopment #Coding #100DaysOfCode #DeveloperJourney

GitHub: https://lnkd.in/gBBRvbsY 🔥 Project 9/20 – Scroll to Top Button ✨ Create a Smooth Scroll-to-Top Button using JavaScript! ✨ This simple yet modern feature improves your website’s user experience instantly. In this project, I used: ⬆️ window.scrollY to detect scroll position 🌪️ scrollTo({ top: 0, behavior: "smooth" }) for smooth scrolling 💡 CSS for fade-in and pop animations A clean, practical JavaScript project that adds polish to any webpage. Don’t just scroll — glide to the top in style 🚀 #webdevelopment #javascript #frontenddevelopment #frontendprojects #htmlcssjs #scrolltotop #smoothscroll #vanillajs #learnjavascript #programming #webdesign #techcommunity #githubproject #uicomponents #frontendinspiration #modernui #creativefrontend #webdevcommunity #codinglife #developerlife #softwareengineering #programminglife #scrollbehavior #frontendskills #codewithusman

This project helped me strengthen my fundamentals in DOM manipulation, event handling, and dynamic UI updates. Users can easily add and delete tasks, and everything updates instantly without page reloads. 💻 Tech Stack: 🔹 HTML – structure 🔹 CSS – styling 🔹 JavaScript – functionality 🧠 Key Learnings: Handling form submissions dynamically using preventDefault() Managing a task list with arrays Creating and updating elements in real-time with JavaScript Here’s a quick peek at the app 👇 ✨ Simple UI ✨ Smooth interactions ✨ Fully responsive 📂 GitHub Repository: https://lnkd.in/epivmr3A 🙏 Special thanks to Pranshoo Rathore Sir for guidance and motivation throughout my journey! #WebDevelopment #JavaScript #HTML #CSS #FrontendDevelopment #MERN #CodingJourney #LearningByBuilding

GitHub : https://lnkd.in/gvjUhzmC 🔥 Day 1 of 20 JavaScript Micro-Projects 👨💻 Today we’re building a fully responsive navbar using only HTML, CSS & Vanilla JS — no frameworks, no shortcuts, just raw frontend grind. Modern UI, glass effect, smooth animations, mobile hamburger toggle — this is how real devs learn UI fundamentals. Because before React, before frameworks, before hype… there were skills. We build foundations. We sharpen fundamentals. We rise. 💡 Project #1: Responsive Navbar 🧠 Concepts: DOM manipulation, class toggling, mobile-first layout 🔗 GitHub repo in bio ⚡ Follow for 19 more fire projects Let’s craft greatness — one line of code at a time. 🚀💙 #javascript #frontend #webdevelopment #htmlcssjavascript  #javascriptprojects #frontendprojects #vanillajs #webdev  #cssdesign #responsivewebdesign #coderlife #uiuxdesign  #codingreels #learnjavascript #frontenddeveloper  #programminglife #javascriptreels #100daysofcode  #webdevcommunity #codetutorial #buildinpublic  #softwareengineering #techcontent #devcommunity  #codeweaver