Built a real-time analog & digital clock using JavaScript, HTML & CSS. . Smooth animations for clock hands ⏱️ . Real-time updates every second 💻 Code on GitHub: https://lnkd.in/daWFt6Rm 🌐 Live Demo: https://lnkd.in/ddBSjzHJ Team : Ahsen Adil Muhammad Shayan Sir : Muhammad Fareed Ali Aftab Sheikh Ghous Ahmed Zeeshan Aijaz Wajid Ullah #JavaScript #WebDevelopment #Frontend #CodingChallenge #JS30 #ClockProject

**"This is our today’s JavaScript class presentation 🎮🍬 We developed a Candy Crush game using HTML, CSS, and JavaScript 💻 JavaScript handles the core functionality including grid creation, candy matching logic, swapping, scoring system, level progression, and interactive effects 🔥 CSS is used for responsive design and styling, while HTML builds the structure of the game. Created by Team Code Crusher ✨ #CodeCrusher #JavaScript #WebDevelopment #GameDevelopment #CodingProject Manaheel Jamil # githb link:https://lnkd.in/dAu5tQqM

🎮 Built a Simon Says Game using HTML, CSS & JavaScript I recently built a memory-based game where users have to repeat an increasing sequence of colors. I created this project while learning from #ApnaCollege, and it helped me strengthen my JavaScript fundamentals. 🔧 Key Features: • Interactive UI with color-based buttons • Keyboard event to start the game • Level progression system • Game-over and restart functionality 💡 What I learned: • DOM manipulation and event handling • Writing game logic step-by-step • Improving UI using HTML & CSS 🔗 Live Demo: https://lnkd.in/gJKbbDHq I would love to hear your feedback and suggestions to improve this further. #WebDevelopment #JavaScript #Frontend #Projects #LearningJourney #100DaysOfCode

🎮 Just built the Classic Simon Game using HTML, CSS & JavaScript! For those who don't know — Simon is a memory-based game where the game shows you a sequence of colors & sounds, and you have to repeat it correctly. With every level, the sequence gets longer and harder! 🧠⚡ It's simple to play but seriously tests your memory and focus! 🛠️ Tech Used: → HTML — Game structure → CSS — Styling & color buttons → JavaScript — Game logic, sequences & event handling ✅ What I practiced: → DOM Manipulation → Event Listeners → Arrays & random sequence generation → setTimeout for animations #JavaScript #HTML #CSS #WebDevelopment #Frontend#LearningInPublic #100DaysOfCode

🎮 Mole Smash Game – HTML | CSS | JavaScript 🌐 Live Demo: https://lnkd.in/g5JePc_M 📂 GitHub Repository: https://lnkd.in/gC2y2ngj 🛠️ Built With: 🧩 HTML for structure 🎨 CSS for layout and animations ⚡ JavaScript for game logic and interactivity 💡 What I implemented: 🔹 Dynamic DOM manipulation to show/hide moles 🔹 Randomized game behavior using JavaScript functions 🔹 Score tracking and real-time updates 🔹 Countdown timer with game control logic 🔹 Event handling for user clicks (smash interaction) 🔹 Smooth animations using CSS transitions 🧠 What I learned: 🔹 How to manipulate DOM elements dynamically 🔹 Managing game state using JavaScript 🔹 Using timers (setInterval, setTimeout) effectively 🔹 Handling user interactions and updating UI in real-time 🙏 Special thanks to: 🔹Alakhananda M N(Mentor) for continuous encouragement 🔹Sarath Lal(Trainer) for teaching standard development practices 🔹Luminar Technolab for providing a great learning environment This project helped me understand how JavaScript brings static pages to life by adding logic, interactivity, and user-driven behavior. More interactive projects coming soon 🚀 #JavaScript #WebDevelopment #FrontendDevelopment #DOM #LearningJourney #MERN #GameDevelopment #LuminarTechnolab

🚀 Just built a cool JavaScript mini-project! Today I worked on a simple but fun concept using DOM manipulation & mouse events 🎯 👉 Created a circle that follows the cursor in real-time 👉 Used event.clientX and event.clientY to track movement 👉 Applied dynamic styling with position: absolute 💡 This small project helped me understand: How browser events work Real-time UI interaction Importance of CSS positioning in JavaScript Sometimes, small projects teach BIG concepts 🔥 Excited to build more interactive UI experiences! #JavaScript #WebDevelopment #Frontend #Coding #Learning #DOM #BeginnerProjects

#Hello #Connections 👋 #100DaysOfCodeChallenge | #Day75 Project: Scroll Progress Indicator with Snap Sections What I built Today I created an advanced scroll-based UI that shows real-time progress using both a top progress bar and a circular indicator. It also includes smooth scroll snapping with active section highlighting. Technologies Used HTML5 CSS3 (Scroll Snap, Animations) JavaScript (Scroll Events, DOM Manipulation, SVG) Challenge I faced Synchronizing scroll position with both linear (top bar) and circular (SVG) progress indicators accurately. How I solved it Calculated scroll percentage using container height and applied it to both width (for bar) and stroke-dashoffset (for circle). Live Demo: https://lnkd.in/dS77GdQ9 Feedback is always welcome! Code Of School Avinash Gour | Ritendra Gour #JavaScript #FrontendDeveloper #WebDevelopment #CSS #UIUX #ScrollAnimation #100DaysOfCode

𝗧𝗵𝗶𝘀 𝘄𝗮𝘀 𝗱𝗼𝗻𝗲 𝘄𝗶𝘁𝗵 𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁. 𝗡𝗼𝘄 𝗖𝗦𝗦 𝗵𝗮𝗻𝗱𝗹𝗲𝘀 𝗶𝘁. Animations and scroll effects were typically built with 𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁 + 𝗖𝗦𝗦. Now modern CSS has features that let us 𝗱𝗼 𝗶𝘁 𝘄𝗶𝘁𝗵 𝗖𝗦𝗦 𝗼𝗻𝗹𝘆. Scroll animations without event listeners or manual calculations. Using: 𝘃𝗶𝗲𝘄() 𝗮𝗻𝗶𝗺𝗮𝘁𝗶𝗼𝗻-𝘁𝗶𝗺𝗲𝗹𝗶𝗻𝗲 𝗮𝗻𝗶𝗺𝗮𝘁𝗶𝗼𝗻-𝗿𝗮𝗻𝗴𝗲 Cleaner code. Native performance. #css #webdevelopment #frontend #javascript #programming #uidesign #reactjs #nextjs

📅 DAY 1 — What is JavaScript? I thought JavaScript is just for buttons… I was wrong 😅 --- JavaScript is what makes websites **interactive** 👉 Click 👉 Scroll 👉 Form submit 👉 Animations --- 💡 Simple definition: JavaScript = language that runs in browser --- Example: HTML → structure CSS → design JS → logic --- 🎯 Without JS → website is static --- Starting my JS journey 🚀 --- Do you know JavaScript basics? YES / NO --- 📌 Save this 🔁 Follow for Day 2 #JavaScript #WebDevelopment #Coding

Today I learned an important JavaScript DOM concept: Event Bubbling vs Event Capturing 🔹 Event Bubbling When an event starts from the target element and moves upward to parent elements. Example: Clicking a button inside a div → button event runs first, then div. 🔹 Event Capturing When an event starts from the parent element and moves downward to the target element. Example: div event runs first, then button. 📌 In JavaScript: element.addEventListener("click", function(){}, true); true enables capturing mode. Without it, default behavior is bubbling. 💡 Understanding event flow helps in building better interactive websites and handling nested elements efficiently. Edure #JavaScript #WebDevelopment #FrontendDevelopment #DOM #CodingJourney #100DaysOfCode