Tic-Tac-Toe Game Built with HTML CSS JavaScript

🚀 Just Built an Escape Room Game using HTML & JavaScript! 🎮🔥 Excited to share my latest project – a fully interactive Escape Game developed using core web technologies! 🧠💡 In this game, players must solve puzzles, unlock clues, and make smart decisions to escape within a limited time. It’s designed to challenge logical thinking, problem-solving skills, and creativity. 🔧 Tech Used: • HTML for structure • CSS for styling & UI • JavaScript for game logic & interactivity ✨ Key Features: ✔️ Interactive puzzles & challenges ✔️ Timer-based gameplay ⏳ ✔️ Dynamic clues & user responses ✔️ Smooth and engaging UI This project helped me strengthen my concepts in DOM manipulation, event handling, and logic building in JavaScript. 💭 Building this game was not just fun, but also a great learning experience in creating real-world interactive applications. 🎥 Check out the demo video below and let me know your feedback! #WebDevelopment #JavaScript #HTML #Coding #GameDevelopment #FrontendDeveloper #Projects #LearningByDoing #TechWithArjun

🚀 Project Showcase: Tic Tac Toe Game using HTML, CSS & JavaScript Excited to share one of my recent mini-projects – a Tic Tac Toe Game built using HTML, CSS, and JavaScript! 🎮 This project helped me strengthen my understanding of DOM manipulation, game logic, and responsive UI design. 🔹 Key Features: Interactive 2-player gameplay Dynamic win detection logic Clean and responsive user interface Reset game functionality 🔹 Technologies Used: HTML – Structure of the game board CSS – Styling and layout JavaScript – Game logic and interactivity Building this project was a great way to practice JavaScript fundamentals and problem-solving skills while creating something fun and interactive. Looking forward to building more projects and continuously improving my development skills! 💻✨ Check my GitHub repo : 🔗 https://lnkd.in/gCz98WpX Day 5 of #100DaysOfCode #WebDevelopment #JavaScript #HTML #CSS #FrontendDevelopment #CodingProjects #LearningJourney

Day-7/21. 🚀 Built a Classic Snake Game using HTML, CSS & JavaScript. I recently developed a fully functional Snake Game using pure HTML, CSS, and Vanilla JavaScript — focusing completely on logic building, DOM manipulation, and game mechanics. This project strengthened my fundamentals in core web development without using any frameworks. 🎮 Game Features: ✅ Smooth snake movement using 'requestAnimationFrame'. ✅ Keyboard controls (Arrow keys). ✅ Self-collision detection. ✅ Wall collision detection. ✅ Dynamic food generation at random positions. ✅ Real-time score tracking. ✅ Snake growth animation after eating food. ✅ Speed control logic. ✅ Background music integration. ✅ Food sound effect. ✅ Game over sound effect. ✅ Restart functionality after collision ✅ Grid-based responsive board using CSS Grid. ✅ Styled snake head & body with gradients. ✅ Fully playable in browser without external libraries. 🎨 Tech Stack Used: HTML (Structure). CSS (Grid layout, styling, gradients, responsiveness). JavaScript (Game logic, movement system, collision detection, DOM rendering). 💡 What I Learned: Building this project helped me understand: ✅ How real-time browser-based games work. ✅ Managing state without frameworks. ✅ Optimizing DOM updates. ✅ Writing clean and structured JavaScript logic. Sometimes the best way to grow is by mastering the basics. More advanced projects coming soon 🚀. #FrontendDevelopment #WebAnimation #SheryiansCodingSchool #UIUX #FullStackDevelopment #21DaysChallenge

🚀 Built a Fully Functional Connect 4 Game using HTML, CSS & JavaScript! Excited to share my latest frontend project — a classic Connect 4 game developed completely from scratch 🎯 🔹 Tech Stack: • HTML – Structured the game board • CSS – Designed a clean and responsive UI • JavaScript – Implemented game logic & interactions 🔹 Key Features: ✔️ Two-player gameplay (Yellow vs Orange) ✔️ Smart piece drop (auto-falls to lowest empty slot) ✔️ Win detection: • Horizontal • Vertical • Diagonal & Anti-diagonal ✔️ Real-time turn updates ✔️ Clean and bug-free interaction This project helped me strengthen my understanding of DOM manipulation, event handling, and game logic design. Looking forward to adding more features like AI opponent, animations, and mobile responsiveness 🚀 💡 Feedback and suggestions are always welcome! #WebDevelopment #JavaScript #FrontendDevelopment #Projects #Coding #HTML #CSS #GameDevelopment #InternPe

Energy Clash: A Turn-Based Card Strategy Game Excited to share my latest project — Energy Clash, a fully playable turn-based card strategy game built using HTML, CSS, and JavaScript. This project focuses on core game development concepts such as: • Turn-based game logic • State management • Player vs Computer AI system • Energy-based attack mechanics • Dynamic leaderboard tracking • Responsive mobile-friendly design ## 🎮 Game Rules 🔹 Each player starts with 100 Energy 🔹 Players take turns selecting action cards 🔹 The goal is to reduce the opponent’s energy to 0 🔹 The last player standing wins the round ### Available Action Cards: • Attack (10 Damage) – Reduces opponent’s energy • Heavy Strike (20 Damage)– High impact attack • Shield– Blocks incoming damage for one turn • Energy Drain (+10)– Steal energy from opponent Strategic decision-making is key — timing your shield, choosing when to go heavy, and managing energy effectively determines victory. Through this project, I strengthened my understanding of: ✔ JavaScript logic structuring ✔ DOM manipulation ✔ Interactive UI design ✔ Game flow control ✔ Handling real-time state transitions ✔ Debugging edge cases Building *Energy Clash* helped me move beyond static web pages into interactive application development with structured logic and dynamic behavior. #WebDevelopment #JavaScript #FrontendDeveloper #GameDevelopment #HTML #CSS #SoftwareDevelopment #BuildInPublic #PortfolioProject

🚀 Just Built a Tic-Tac-Toe Web Game! I recently created a classic Tic-Tac-Toe game using HTML, CSS, and JavaScript. This project helped me practice JavaScript logic, DOM manipulation, and responsive UI design. ✨ Features: • Two-player mode (X vs O) • Win detection (horizontal, vertical, diagonal) • Score tracking system • Reset game & reset score options • Responsive and clean UI 🎥 Demo Video: 🌐 Live Demo: https://lnkd.in/dXQ7gyEK Building small projects like this is a great way to strengthen problem-solving and frontend development skills. #WebDevelopment #JavaScript #FrontendDeveloper #HTML #CSS #CodingProjects

Building Fun with Code: My Connect 4 Game 🎮 I recently challenged myself to create a Connect 4 game entirely in pure JavaScript, HTML, and CSS, and the result is a playful, interactive game that runs directly in the browser no setup required! Features I implemented: Classic Connect 4 mechanics: two players alternate dropping discs into a 6×7 grid. Real-time win detection: horizontal, vertical, and diagonal. Interactive UI: hover effects, smooth color changes, and reset functionality. Fun, attractive design: the game is wrapped in a creamy, soft-colored box with rounded corners and playful styling. #WebDevelopment #JavaScript #HTML #CSS #FrontendDevelopment #CodingFun #Projects

𝗝𝘂𝘀𝘁 𝗕𝘂𝗶𝗹𝘁 𝗮 𝗚𝗮𝗹𝗮𝘅𝘆-𝗧𝗵𝗲𝗺𝗲𝗱 𝗠𝗲𝗺𝗼𝗿𝘆 𝗠𝗮𝘁𝗰𝗵𝗶𝗻𝗴 𝗚𝗮𝗺𝗲! 🌌 I recently developed an interactive Memory Matching Game using HTML, CSS, JavaScript, and jQuery as part of my learning in web development. The game challenges players to flip cards and find matching pairs within a 60-second time limit. Each match reveals a space-themed symbol, and the game includes sound effects, animations, a move counter, and dynamic card shuffling to make the experience engaging and interactive. ✨ Key Features: • Dynamic card generation and random shuffling • Card flip animations and smooth UI effects • 60-second countdown timer • Move tracking system • Sound feedback for correct and wrong matches • Restart functionality for a new shuffled game This project was completed under the supervision of Mam Juhinah Batool 🎥 I’m attaching a video demo of the game below. 🔗 The complete project is available on GitHub: https://lnkd.in/dWXBBFJJ #WebDevelopment #JavaScript #jQuery #FrontendDevelopment #StudentProject #LearningByDoing #CodingJourney #InteractiveWeb

🎮 Just built a browser-based strategy game from scratch — Stone vs Stick! A 3×3 tactical board game built purely with HTML, CSS & JavaScript. No frameworks, no libraries — just clean vanilla code. What's inside: 🪨 vs 🪵 two-player strategy on a connected node grid Two phases — Placement & Movement Win by lining up 3 pieces: horizontal, vertical, or diagonal First to 5 rounds wins the match 🤖 AI opponent with strategic blocking & winning logic 🪙 Animated coin toss to decide who goes first 🎨 4 immersive themes — Forest, Mountain, Water & Fire 📱 Fully responsive — works on mobile & desktop Drag & drop piece movement with snap-to-node validation This was a fun challenge in pure JS game logic — turn management, win detection, AI decision trees, CSS 3D animations, and touch/drag interactions all without a single dependency. 🔗 Play it here: [https://lnkd.in/ggtXKhVU] Built and deployed via GitHub Pages. #buildinpublic #javascript #webdev #gamedev #opensource #html #css #frontenddevelopment

## DAY 16 — Flappy Bird Day 16/30: Recreated Flappy Bird in the browser. Gravity, collision detection, pipe generation, score tracking, game loop — this was the most complex single-file project of the challenge so far. The game loop concept (update state → check collisions → render → repeat) completely changed how I think about interactive applications. It's not that different from how UI frameworks work under the hood. 🔗 Live: https://lnkd.in/gi3wbdCt 🔗 Code: https://lnkd.in/gu2pwGkj #30DaysOfCode #JavaScript #GameDev #WebDevelopment #BuildInPublic #WomenInTech