Building a Simon Says Game with HTML CSS JavaScript

🎮 Built a Snake Game using HTML, CSS & JavaScript — with persistent high scores! This project was more than just recreating a classic game. I focused on making it interactive and state-aware. 💡 Highlights: • Smooth snake movement & keyboard controls • Real-time score tracking • 🧠 High score saved using LocalStorage (persists even after refresh) • Game over + restart functionality • Clean UI for better user experience ⚙️ One interesting challenge was managing game state and ensuring the high score updates correctly without breaking the flow. This project helped me understand DOM manipulation, event handling, and how browsers can store data locally. 🚀 Next: Adding levels, sound effects, and mobile responsiveness! Would love your thoughts and suggestions 🙌 #JavaScript #WebDevelopment #Frontend #Projects #Coding #100DaysOfCode

 A fully interactive Rock Paper Scissors Game built using HTML, CSS, and JavaScript. This project focuses on strengthening core JavaScript concepts and improving logical thinking by implementing real-time game functionality. 🔹 Technologies Used: - HTML5 - CSS3 (Responsive UI & Styling) - JavaScript (Game Logic & DOM Manipulation) 🔹 Key Features: - Interactive user interface - Random computer choice generation - Real-time result display (Win / Lose / Draw) - Score tracking system - Clean and responsive design 🔹 What I Learned: - Handling click events in JavaScript - Implementing conditional logic - Using Math.random() for dynamic behavior - Updating UI dynamically using DOM - Improving problem-solving skills - Building this project helped me strengthen my JavaScript fundamentals and understand how game logic works in real-world applications. 🔗 Live Demo: https://lnkd.in/gSeDQmQw 📂 GitHub Repository: https://lnkd.in/gY-dV_bY I’m continuously learning and building more projects. Feedback and suggestions are always welcome! #WebDevelopment #JavaScript #FrontendDeveloper #HTML #CSS #LearningJourney

Built a Pac-Man from scratch. No libraries. No frameworks. Just vanilla JavaScript, HTML5 Canvas, and CSS. 👾 The result? Pac-Man Neon Arcade — a fully functional, neon-themed recreation of the classic game, running entirely in the browser. Here's what's under the hood: 🕹️ Game logic built with ES6 Modules — character movement, collision detection, and a full state machine 🎨 HTML5 Canvas for rendering the maze, Pac-Man, and ghost animations 👻 Individual AI written for each ghost — they don't all behave the same 🔊 Sound effects, high score tracking, multiple difficulty levels, and pause/resume The most challenging part? Writing the ghost AI from scratch. Each ghost has its own targeting logic, which is what makes the original game feel alive — and replicating that without any game engine was a great exercise in thinking algorithmically. No npm install. No build step. Just clone and open index.html. 🔗 GitHub: https://lnkd.in/gg7ybRS5 🔗 Live Link: https://lnkd.in/gYYxsmaQ Would love feedback from fellow devs — especially on the architecture and AI logic! #JavaScript #HTML5Canvas #GameDev #VanillaJS #BuildInPublic #WebDevelopment #OpenSource

🚀 Built a Rock Paper Scissors Game using Pure HTML, CSS & JavaScript! Excited to share my recent mini project — a fully functional Rock Paper Scissors Game built using only HTML, CSS, and basic JavaScript (no frameworks, no AI tools). 💡 Features: 🎮 Interactive Rock, Paper, Scissors gameplay 📊 Live Scoreboard 💾 Score persistence using Local Storage 🔄 Reset button to clear scores instantly 🔁 Automatically restores latest score even after closing & reopening the browser This project helped me strengthen my understanding of: -DOM Manipulation -Local Storage Basic Game Logic Implementation Clean UI structuring with CSS Small projects like these are helping me build strong fundamentals in JavaScript and frontend development. More projects coming soon 🚀 #HTML #CSS #JavaScript #WebDevelopment #FrontendDeveloper #LearningByDoing #Projects

Just wrapped up building a Web Based Memory Matching Game using HTML, CSS, and JavaScript under the supervision of Ma'am Juhinah Batool  In this game, players flip cards to find matching pairs, with a move counter, timer, and audio feedback for correct or wrong matches. Images remain hidden until flipped, adding a fun challenge, and the dark neon theme gives it a clean, modern look. Skills I practiced while building this: DOM manipulation with jQuery Event handling and game logic CSS transitions and styling for a polished UI Timer and state management in JavaScript It was a great exercise in combining dynamic functionality with visual design, and it really strengthened my front-end development skills. Check out the project and try it yourself: https://lnkd.in/g8ctU5VX #WebDevelopment #JavaScript #HTML #CSS #FrontEnd #Coding

Just built my first real JavaScript project 🚀 I created a Simon Says Game using HTML, CSS, and JavaScript. 🔹 Features: • Dynamic color sequence generation • Real-time user input validation • Progressive difficulty levels 🔹 What I focused on: • DOM manipulation • Event handling • Structuring game logic This project helped me understand how small UI interactions actually work behind the scenes. 👉 Try it here: https://lnkd.in/gVuXbaAq Would appreciate feedback 🙌 #javascript #webdevelopment #100DaysOfCode #learninginpublic

🚀 Just built a Hangman Game using HTML, CSS & JavaScript! 🎯 Features: • Letter-by-letter guessing system • Hint provided for each word • Maximum 6 wrong attempts • 😢 Sad emoji on loss • 🎉 Victory emoji on success This project helped me strengthen my understanding of: ✔ DOM Manipulation ✔ Event Handling ✔ Game Logic Implementation 💡 It was fun designing the logic behind tracking wrong guesses and updating the UI dynamically. 🔗 Check out the code here: https://lnkd.in/gMnvFf-i #WebDevelopment #JavaScript #FrontendDevelopment #CodingProjects #100DaysOfCode

⚡ Day 2 – getElementById vs querySelector (Real Difference) Selecting elements is one of the most important parts of DOM manipulation. But knowing the difference between these two methods makes your code cleaner and smarter. 🔹 getElementById() ✔ Selects element by id ✔ Slightly faster (direct lookup) ✔ Returns a single element ✔ ID must be unique 🔹 querySelector() ✔ Uses CSS selectors ✔ Can select id, class, or tag ✔ Returns the first matching element ✔ More flexible 🧠 Key Difference: getElementById() works only with id. querySelector() works with any valid CSS selector. Bonus Tip: Use querySelectorAll() when you need multiple elements (returns a NodeList). Mastering small DOM fundamentals like this makes advanced JavaScript much easier. #JavaScript #WebDevelopment #Frontend #DOM #JSConcepts #Coding #100DaysOfCode

Built a Snake Game using HTML, CSS & JavaScript 🎮 Today I built the classic Snake Game from scratch using pure frontend technologies 🚀 🛠 Tech Used: HTML – Structure CSS – Styling & Game Board Design JavaScript – Game Logic & Movement 💡 What I implemented: ✔ Snake movement using arrow keys ✔ Food generation at random positions ✔ Score tracking system ✔ Collision detection (wall + self) ✔ Game Over logic This project helped me understand: DOM manipulation deeply Event listeners (keydown events) setInterval & game loops Array manipulation for snake body tracking Real-time UI updates Building small games is one of the best ways to improve JavaScript logic 🔥 Next goal: Add levels & increasing speed 😎 What was the first game you built while learning JavaScript? #JavaScript #WebDevelopment #FrontendDeveloper #CodingJourney #LearningInPublic

This quick video (0:00) provides a brief overview of five key web development technologies: XML & JSON (0:02): Defined as file formats used for data representation. Ajax (0:07): Explained as a method to get data from a server asynchronously. jQuery (0:08): Described as a library used primarily for animation. Node.js (0:10): Introduced as a runtime environment to run JavaScript code outside the browser. https://lnkd.in/d4QX2Ky9