👇 💣 Day 38/100 – Bomb Defuser Timer using JavaScript ⏱ Thrilled to continue my #100DaysOfCode journey with an exciting mini-project — a Bomb Defuser Timer App 💥 In this project, I created a countdown timer that ticks down from 10 seconds, and the user must type “defuse” before it hits zero to prevent the bomb from exploding! 🧨 ✨ What I learned today: 🔹 How to use setInterval() and clearInterval() for timer control ⏳ 🔹 Handling keyboard events (like pressing Enter) 🔹 Real-time DOM updates for dynamic interactions A fun way to practice JavaScript timing and event handling — definitely one of the most thrilling projects so far! ⚡ #100DaysOfCode #JavaScript #WebDevelopment #Frontend #LearningByDoing #NxtWave #CCBP #CodingChallenge #HTML #CSS #DOMManipulation #TimerApp #JavaScriptProjects
More Relevant Posts
-
⏰ Day 39/100 – Time Converter using JavaScript ⚡ Excited to share my next project in the #100DaysOfCode challenge — a Time Converter App! 🕒 This simple yet useful app takes input in hours and minutes and converts it into seconds instantly. A great exercise to sharpen my JavaScript logic and DOM manipulation skills. 💡 ✨ What I learned today: 🔹 Handling user inputs and form validations 🧮 🔹 Performing arithmetic operations dynamically 🔹 Updating the DOM with calculated results Every project adds more clarity to my understanding of JavaScript fundamentals and real-world problem-solving! 💪 #100DaysOfCode #JavaScript #WebDevelopment #Frontend #NxtWave #CCBP #CodingChallenge #LearningByDoing #HTML #CSS #DOMManipulation #ProblemSolving
To view or add a comment, sign in
-
🧠 Day 37/100 – KeyCode Detector using JavaScript ⚡ Continuing my #100DaysOfCode challenge with another fun and interactive project! Today, I built a KeyCode Detector App that shows the key codes of the keys you press. 🎹 ✨ What I learned today: 🔹 How to use keyboard events (keydown) in JavaScript 🔹 How to dynamically create and update HTML elements using the DOM 🔹 Improved understanding of event objects and how browsers handle user input This project is simple yet powerful — great for understanding real-time interactions between users and web applications. 💡 #100DaysOfCode #JavaScript #WebDevelopment #Frontend #LearningByDoing #CodingChallenge #NxtWave #CCBP #HTML #CSS #DOMManipulation #KeyboardEvents
To view or add a comment, sign in
-
Just built a small yet cool project — a Color Changer App 🎨 using plain JavaScript! It’s a simple idea: click any color button, and the entire background changes instantly. But behind the scenes, I got hands-on practice with some core JS concepts — like event listeners, DOM manipulation, and style updates through JavaScript. It’s amazing how even small projects like this can boost your understanding of the basics. Step by step, learning and improving every day 💻✨ #JavaScript #FrontendDevelopment #WebDevelopment #CodingJourney #HTML #CSS #LearningByBuilding #WebDeveloper #DOMManipulation #Frontend #ProgrammerLife #100DaysOfCode #ExlonTech
To view or add a comment, sign in
-
JavaScript for 15 Days – Day 6: If / Else Statements. Today you'll know how to make your JavaScript code think and decide using if, else if, and else statements. These structures allow programs to run different blocks of code based on specific conditions just like real-life decisions: let score = 85; if (score >= 90) { console.log("Excellent!"); } else if (score >= 70) { console.log("Good job!"); } else { console.log("Keep practicing!"); } Key Takeaways: if checks the first condition. else if tests another one if the first fails. else runs only when all above are false. Conditional statements are what make code dynamic and smart they let programs respond to different situations! #JavaScript #FrontendDevelopment #WebDevelopment #CodingJourney #LearnToCode #15DaysJS #DevPerDay
To view or add a comment, sign in
-
Web Development – Event Bubbling Today, we explored one of the key JavaScript concepts: Event Bubbling. Event bubbling happens when an event on a nested element (like a child div) also triggers the same event on its parent elements, moving from the innermost element outward. We also learned how to use event.stopPropagation() to stop the event from moving up the DOM, and added a fun touch by dynamically changing background colors with setInterval() and setTimeout() functions. A great way to understand how JavaScript handles events and timing in real projects. GitHub: https://lnkd.in/dyh-M34h #JavaScript #WebDevelopment #FrontEndDevelopment #EventBubbling #CodingLearning #HTML #CSS #Programming
To view or add a comment, sign in
-
Day 69 of #100DaysCodeChallenge Today, I practiced an exciting JavaScript functionality — a Click Counter App that remembers your progress using Local Storage! What I did: ✅ Added HTML elements inside the container with the id clickCounterContainer. ✅ Created a span element with the id counterValue to display the count. ✅ Added a button with the id incrementBtn to increase the count. ✅ Used Local Storage to save the click count value with the key clickCount. ✅ On page reload, if clickCount exists, it displays the saved value; otherwise, it starts from 0. ✅ Each button click increments the count and updates both the screen and local storage. This practice helped me understand how to persist data across sessions using localStorage — a crucial concept in modern web development! #100DaysOfCode #Day69 #JavaScript #WebDevelopment #FrontendDevelopment #LearnByDoing #CCBP #NxtWave #CodingJourney #ProgrammerLife #HTML #CSS #JS #CodeNewbie #PracticeMakesPerfect #DeveloperCommunity
To view or add a comment, sign in
-
Okay, Day 9 was all about leveling up the JavaScript foundation. I spent the day deep-diving into Arrays, and honestly, they're the best! An array is essentially a super-powered list that lets you store a ton of information—like every item on a menu—under one neat variable. Getting comfortable with array methods like .push() and .forEach() feels like I've just unlocked a huge part of dynamic web building. It's the difference between hard-coding everything and letting JavaScript manage the content for me. Feels good to get this fundamental piece of logic fully wired! Question: Why is using an array (like dishes = ["soup", "salad"]) so much better than just using a bunch of separate variables (like dish1, dish2, dish3) when dealing with dozens of items?" #Javascript #arrays #31dayschallenge #webdevelopment #frontend
To view or add a comment, sign in
-
-
Built a simple counter app to practice vanilla JavaScript DOM manipulation. Hooked up event listeners for increment, decrement, and reset and stored progress to Local Storage. It's all about making the page interactive! Live Demo: https://lnkd.in/gNaASDjS Code: https://lnkd.in/gzTq9Fxc #Cohort2 #SheryiansCodingSchool #SheryiansCodingSchoolCommunity #JavaScript #DOM #Frontend #WebDeveloper #CodingPractice
To view or add a comment, sign in
-
**New ReactJS Tutorial in the Gen Z JavaScript Series!** 🚀 Building dynamic web applications often means displaying lists of data—whether it's user comments, product listings, or navigation items. But are you doing it *correctly* and *efficiently*? In my latest video, we dive deep into **Rendering Lists in ReactJS**, focusing on the essential **.map()** method and, crucially, **why the 'key' prop is non-negotiable!** Avoid those common console warnings and boost your app's performance and stability. **You'll learn:** * How to use the `.map()` method to iterate over arrays in JSX. * The critical role of unique `keys` for list items. * Best practices for rendering dynamic components from data. Master this core React concept now: https://lnkd.in/dNhijCQ3 What's your biggest challenge when working with lists in React? Share in the comments! 👇 #ReactJS #JavaScript #ListRendering #ReactKeys #WebDevelopment #Frontend #GenZJavaScript #ReactTutorial
React List Rendering:The .map() Method & Why You MUST Use Keys #reactjs #javascript 11 November 2025
https://www.youtube.com/
To view or add a comment, sign in
-
💻 JavaScript Error Reference – Know Your Errors! In JavaScript, errors aren’t always bad — they help you spot what went wrong! 🚫💡 The Error Reference in JavaScript gives developers detailed info about what kind of problem occurred and where it happened. Here are the most common error types you’ll encounter 👇 🔹 ReferenceError – When you try to use a variable that hasn’t been declared. 🔹 SyntaxError – When your code has invalid syntax. 🔹 TypeError – When a value isn’t the expected data type. 🔹 RangeError – When a number is out of an allowed range. 🔹 URIError – When you misuse URI functions. 🔹 EvalError – Rare, but triggered by issues in the eval() function. 🧠 Pro Tip: Use try...catch blocks to handle these errors gracefully, so your app doesn’t crash when something goes wrong! Example: try { console.log(x); // x is not defined } catch (error) { console.error(error.name + ": " + error.message); } 👀 JavaScript errors aren’t enemies — they’re guides pointing you to cleaner, smarter code! 💪 #JavaScript #CodingTips #WebDevelopment #JSBeginner #LearnCoding #webdev #frontend #codecraftbyaderemi
To view or add a comment, sign in
-
Explore content categories
- Career
- Productivity
- Finance
- Soft Skills & Emotional Intelligence
- Project Management
- Education
- Technology
- Leadership
- Ecommerce
- User Experience
- Recruitment & HR
- Customer Experience
- Real Estate
- Marketing
- Sales
- Retail & Merchandising
- Science
- Supply Chain Management
- Future Of Work
- Consulting
- Writing
- Economics
- Artificial Intelligence
- Employee Experience
- Workplace Trends
- Fundraising
- Networking
- Corporate Social Responsibility
- Negotiation
- Communication
- Engineering
- Hospitality & Tourism
- Business Strategy
- Change Management
- Organizational Culture
- Design
- Innovation
- Event Planning
- Training & Development