🕒 Just built a Simple Digital Clock using JavaScript! This small project helped me understand how to: ✅ Work with Date() objects in JavaScript ✅ Use setInterval() to update time every second ✅ Style elements using HTML & CSS ✅ Create a clean, responsive UI It’s a simple yet powerful way to learn how JavaScript interacts with the DOM and updates content dynamically. 💻 Tech Stack: HTML | CSS | JavaScript Excited to keep building more front-end projects! 🚀 #JavaScript #WebDevelopment #Frontend #Coding #LearningByDoing #HTML #CSS #DigitalClock #100DaysOfCode

🚀 Built QR Code Generator Using HTML, CSS, and JavaScript! Sometimes the best way to learn JavaScript is to build something practical — so I created a simple QR Code Generator from scratch. 🔧 What it does: Takes any text or URL as input Instantly generates a QR code Lets you download it as a PNG image 🎯 Tech Stack: HTML + CSS + JavaScript (with a lightweight QR library) 💡 What I learned: ▪️How third-party JS libraries can simplify complex logic ▪️Handling user inputs and updating the DOM dynamically ▪️Generating images directly from a <canvas> element 💬 What’s next: Planning to enhance it with color customization and logo embedding inside the QR. #JavaScript #HTML #CSS #WebDevelopment #Frontend #LearningByBuilding #QRCode #Project

🤔 What do you guys think — do let and const allow hoisting in JavaScript? Most people would say no, but the real answer is... Yes, they do! 💡 Both let and const are hoisted in JavaScript — but not in the same way as var. Here’s the catch 👇 When the JavaScript engine runs your code, it creates a Execution context — this includes a separate memory space for variables declared with let and const. Unlike var, which gets initialized with undefined in the global memory, let and const are placed in a different memory (block scope) but not initialized immediately. That’s why if you try to access them before their declaration, you’ll get a ReferenceError ⚠ and not undefined. This time between hoisting and initialization is called the 𝐓𝐞𝐦𝐩𝐨𝐫𝐚𝐥 𝐃𝐞𝐚𝐝 𝐙𝐨𝐧𝐞 (𝐓𝐃𝐙) . --- 💡 Example console.log(x); // ReferenceError ❌ let x = 5; Here, x is hoisted but not yet initialized — it’s in the Temporal Dead Zone from the start of the block until its declaration line. --- 🧠 In Simple Terms ✅ var → hoisted & initialized with undefined ⚠ let / const → hoisted but not initialized → Temporal Dead Zone 💬 Accessing them before declaration → ReferenceError --- ✨ Quick Tip To avoid TDZ issues: > Always declare your variables at the top of their scope before using them. --- 💬 JavaScript hoisting can be tricky — it’s not about whether variables are lifted, but when and where they get initialized in memory. #JavaScript #WebDevelopment #Frontend #LearningJourney #TemporalDeadZone #LexicalEnvironment #Hoisting #JSConcepts

🚀 Day 46 | DOM Traversal & Styling in JavaScript 🚀 Today I explored how JavaScript interacts directly with HTML elements — controlling structure and style dynamically. 🧩 What I learned: • Used getElementById() & querySelector() to select elements • Changed styles via .style and .cssText • Managed attributes using setAttribute() • Controlled classes dynamically with .classList.add(), .remove(), .toggle() ✨ Insight: DOM manipulation is like editing your website live — JS gives you creative power over content and visuals together. 🔗 GitHub: https://lnkd.in/dtdU9-zZ #WebDevelopment #JavaScript #DOM #Frontend #LearningJourney #CodingChallenge

💣 Built a Bomb Countdown Scheduler using HTML, CSS & JavaScript! I developed a mini application where a bomb countdown starts from 10 seconds and triggers an explosion visual once the timer reaches zero. Every second, the UI updates dynamically creating a realistic countdown experience. 📌 What I improved in this project: • Implementing time-based UI updates using JavaScript • Handling real-time DOM manipulation and state changes • Managing logic flow based on countdown conditions • Controlling timed events visually and functionally in the frontend ⏱️ setInterval() was used to continuously run a function every 1 second to decrement the time and update the display. 🛑 clearInterval() stopped further execution once the final condition was reached to prevent unnecessary memory usage. 💻 Tech Used: HTML | CSS | JavaScript 🔗Demo Link : https://lnkd.in/gUwb-6Hs #HTML #CSS #JavaScript #FrontendDevelopment #WebProjects #LearningByBuilding #MiniProject #JSLearning #FrontendJourney #CodeEveryDay Manoj Kumar Reddy Parlapalli

💻 Just built a small card project using HTML, CSS & JavaScript! I recently created a simple UI project where users can fill a form to add new cards dynamically. Each card shows user info like name, hometown, and category — and everything is stored in localStorage so it stays even after refresh. It was a great learning experience for me to understand how data is saved, retrieved, and displayed using JavaScript DOM manipulation. Still improving it step by step — adding more features soon 🚀 If you’ve worked on something similar, I’d love to hear your thoughts or suggestions! https://lnkd.in/d2K-VUZQ #HTML #CSS #JavaScript #LearningByDoing #FrontendDevelopment

Understanding Map in JavaScript 💡 Why You Should Use Map Instead of Plain Objects Many developers still use objects for key-value pairs, but did you know JavaScript has a better alternative? Meet Map 👇 const userMap = new Map(); userMap.set("name", "Hemant"); userMap.set("age", 25); console.log(userMap.get("name")); // Hemant ✅ Advantages over objects: Keeps keys in insertion order Can use any type (even objects) as keys Has built-in methods: set(), get(), has(), delete(), and clear() If you’re still using plain objects for mapping, it’s time to level up 🚀 #JavaScript #WebDevelopment #CodingTips #Frontend

Here's my latest project for the #30Days30JSChallenge: Custom Select Menu! 🚀 This project demonstrates how to build a fully functional, stylish dropdown menu using only HTML, CSS, and vanilla JavaScript. It replaces the default browser <select> menu with a custom UI for better styling and control. Key Features Implemented: ✨ Custom styling for the select field and options. 🖱️ Click-to-Toggle: The options list appears only when the select field is clicked. 🔄 Dynamic Text Update: Selecting an option updates the main field text and image. This was project 24 of 30! Just a few more to go! Check out the full code and give it a star if you find it helpful: 🔗 Project Link: https://lnkd.in/gUgu8qDE #JavaScript #WebDevelopment #FrontendDevelopment #HTML #CSS #JSProjects #Developer #CustomSelectMenu #30Days30JSProjects