Decided to take a little trip down memory lane! 🚀 Years ago, one of the very first things I ever built when I was learning to code was a really basic Tic-Tac-Toe game. Today, I figured it would be fun to open up that old repository and see how much I could improve it. It’s still a super simple Vanilla JavaScript app at its core, but giving it a 2026 glow-up was an absolute blast. Here’s what I changed to bring it into the modern era. ✨ The Glow Up: I completely ripped out the old styling and added modern glass UI effects along with a theme switcher. You can now play in Cyberpunk Neon, Deep Midnight, or Royal Gold. 🎮 Better Gameplay: Instead of the game ending immediately, I turned it into a combo-scoring game. You keep playing until the whole 3x3 or 5x5 board is completely full to rack up points. 🤖 Smarter Logic: The computer opponent isn't a total pushover anymore! I added some simple logic so it actively looks for winning spots, blocks my moves, or takes the center tile. 🌐 Online Play: To top it off, I hooked it up to Firebase so can actually send a room link to friends and play against them in real time. Want to play a round? Try it out here (works on mobile too!): 🔗 https://lnkd.in/gZEdadvu It's actually crazy to look back at the code I wrote years ago compared to how I approach things today. Honestly, revisiting your very first projects is a massive confidence booster and a great reminder of how far you've come. #JavaScript #WebDev #CodingJourney #SideProject #CSS #HTML #Frontend #Firebase #LearnToCode
More Relevant Posts
-
🐍 **Just shipped: Grand Snake Game v1.0.0** 🎮 Turned the classic Snake game into a full React + Vite project with a retro twist. What started as a simple nostalgia build ended up with: - **3 progressive levels** - Grassy Plains → Rocky Path → Maze Runner - **Power-ups that change gameplay** - Chilli for 2x speed, Mushroom to slow down - **Weighted food system** - Golden Apples are rare but worth 5x points - **Complete game flow** - Main menu, pause, level progression, high scores with localStorage - **Retro UI** - Press Start 2P font, neon accents, smooth animations Biggest challenge: Managing the game loop with React hooks without stale closures. Solved it with a `useRef` pattern to keep the interval synced with live state. Also added dynamic difficulty - each level has its own board size, speed, and obstacle layout. Built with React 18, Vite, and pure CSS. No canvas, no game libraries - just divs and state management. Sometimes constraints force the most creative solutions. Play tested it way too much while "debugging" 😅 Code available and feedback welcome. What retro game should I rebuild next? Built by: karthikCodingSolutions #ReactJS #Vite #WebDev #JavaScript #Frontend #GameDev #ReactDeveloper #Coding #WebDevelopment #100DaysOfCode #SoftwareEngineering #OpenSource #UIUX #CSS #PortfolioProject #IndieDev
To view or add a comment, sign in
-
🎮 Most games let you play. This one lets you CREATE the game itself. I grew up playing classic DOS games like Dangerous Dave & Prince of Persia. Back then, the levels were fixed — you could only play what was given. I wanted to change that. What if the player became the designer? So I built DANGEROUS GAME — a browser-based retro platformer that doubles as a game creation platform. 👉 Build your own levels with a visual tile editor 👉 Control everything — enemies, weapons, physics, scoring 👉 Export your game as JSON and share it 👉 Others can import and play your exact version Swipe through the slides to see it in action ↓ Built from scratch — vanilla JS, zero frameworks, zero dependencies. No installation. No setup. Just open and play. 🔗 Play it now: https://lnkd.in/diRkMW6F 💭 Try it and tell me: → What did you build? → What would you suggest to improve? #gamedev #indiedev #javascript #html5 #buildinpublic #frontend #opensource #retro #coding #indiegame
To view or add a comment, sign in
-
Day 20 of #30Appsin30Days — and I built a multiplayer game. 🎮 FogClaim.io is a real-time territory capture game — think Paper.io — where up to 5 players race to claim as much of a 100×100 grid as possible while hunting each other's trails. Here's the constraint I set myself: no game engines, no frontend frameworks. Just HTML Canvas, vanilla JavaScript, Node.js, and WebSockets. One dependency. Zero build tools. The hardest problem wasn't the rendering or the UI — it was collision detection. In a game loop that processes players sequentially, Player A might walk through Player B's trail without dying — simply because B's trail didn't exist in the map yet when A was evaluated. The iteration order decided who lived and who died. The fix: restructure the entire tick into three phases. Phase 1: Move all players simultaneously. Phase 2: Evaluate all collisions against the same map state. Phase 3: Let survivors lay trail and capture territory. Separating state mutation from state evaluation made the collision logic fully order-independent. A lesson that applies well beyond game dev. A few other things I'm proud of: → Flood-fill territory capture using typed arrays (Int16Array) for performance on a 10,000-cell grid → Session token reconnection — refresh mid-game and your position is restored for 10 seconds → A "peakAlive" counter that prevents a solo player from farming wins before opponents join → Swipe controls on mobile that actually feel good 10 days left in the challenge. I've shipped 20 apps in 20 days — solo, from scratch, every single day. What I've learned most: the gap between "it works in my head" and "it works with two players simultaneously doing unexpected things" is where all the real engineering lives. If you want to see the code or try the game, link in the comments. Github: https://lnkd.in/ghtEDeSM #buildinpublic #30Appsin30Days #JavaScript #WebSockets #GameDev #NodeJS #IndieHacker #SideProject
To view or add a comment, sign in
-
-
🚀 Just built: GameHub – A Browser-Based Gaming Platform A lightweight gaming hub built with HTML, CSS, and JavaScript — no backend, fully playable in the browser. 🎮 Features: • 8 mini-games (Tic-Tac-Toe with AI, Snake, 2048, Sudoku & more) • Achievements & leaderboard system • Persistent profiles (localStorage) • Sound system + PWA (offline support) 🧠 Clean architecture with iframe sandboxing & modular JS. 👉 Try the live demo: https://lnkd.in/g848_a57 🔗 GitHub: https://lnkd.in/gBezHW29 ✨ More updates coming soon. #JavaScript #WebDevelopment #Frontend #GameDev
To view or add a comment, sign in
-
One day my sister and I were playing UNO online, and after every single game… ads It got really annoying, and she just said, “why don’t you build your own one?” That actually stuck with me. So this is my Phase 1 I built a simple real-time multiplayer UNO-style game using: • Node.js • Socket.io • Basic HTML, CSS, JS What I’ve implemented so far: • Create and join rooms using a room code • 2-player real-time gameplay • Turn-based system handled completely on the server • Card logic like +2, skip, reverse, and wild • UNO call with penalty • Turn timer (auto action if a player is idle) This project turned out to be more than just a small game. I got a much better understanding of how real-time systems work which handling multiple users, syncing game state, and why server-side control really matters. Still a lot to improve and clean up, but I genuinely enjoyed building this. If you have any suggestions or ideas, feel free to share #nodejs #socketio #realtime #webdevelopment #learningbydoing
To view or add a comment, sign in
-
🎮 Just Built a Hangman Game using React! Excited to share my latest project — an interactive Hangman game with a clean UI and smooth gameplay. ✨ Features: Real-time word guessing logic Interactive keyboard input Win/Loss detection Responsive design 🚀 Live Demo : In Comments 💻 GitHub : https://lnkd.in/g_YGQSjb This project helped me improve my React skills and understand state management better. Would love your feedback! #React #WebDevelopment #Frontend #Projects #JavaScript
To view or add a comment, sign in
-
Task: Snake Game Using HTML CSS JavaScript 🔑 Key Features: 1. 🎮 Interactive gameplay with smooth keyboard controls 2.⚡ Dynamic speed increase as score grows 3. 🏆 Real-time score tracking with game-over detection 4. 📱 Responsive design with mobile-friendly controls Designed and developed an interactive browser-based game with dynamic game logic and real-time user input handling. Utilized DOM manipulation and event-driven programming to ensure smooth gameplay and responsive performance.
To view or add a comment, sign in
-
🎮 Built a Responsive Tic Tac Toe Game using HTML, CSS & JavaScript! ✅ Features: Two-player gameplay, win/draw detection, reset & new game functionality 🧠 Implemented winning logic using JavaScript arrays and pattern matching 🔄 Dynamic DOM manipulation and event handling for smooth interactions 📱 Fully responsive design that adapts across mobile, tablet, and desktop screens 💡 Strengthened concepts like conditional logic, state management, functions, and UI responsiveness Excited to keep building more interactive web projects 🚀 Check it out here: [https://lnkd.in/dgt7nV-S]
To view or add a comment, sign in
-
🚀 Built a Fun Stick Hero Game using HTML, CSS & JavaScript! Excited to share my latest mini project 🎮 — a Stick Hero Game inspired by classic arcade mechanics! ✨ Features: Smooth canvas-based animations Dynamic platform generation Real-time scoring system “Perfect hit” bonus logic 💯 Responsive full-screen gameplay 🛠️ Tech Stack: HTML5 | CSS3 | JavaScript (Canvas API) 💡 What I learned: Game loop using requestAnimationFrame Working with Canvas for animations Handling user interactions (mouse events) Logic building for collision detection & physics This project helped me strengthen my JavaScript fundamentals and understand how real-time games work behind the scenes. 👉 Try building it yourself or let me know if you want the code! #JavaScript #WebDevelopment #FrontendDeveloper #GameDevelopment #HTML5 #CSS3 #Coding #Projects #LearningByDoing
To view or add a comment, sign in
-
🎮 Tic Tac Toe Game 🚀 Overview Built a fully functional Tic Tac Toe Game from scratch, focusing on implementing efficient game logic, handling user interactions, and delivering a smooth gameplay experience. ✨ Features • Two-player turn-based gameplay (Player X vs Player O) • Real-time win and draw detection • Interactive and responsive UI • Handles all edge cases for valid game outcomes. 🛠️ Tech Stack : HTML5 , CSS3 , JavaScript 📂 Source Code 👉 https://lnkd.in/gHuhQEES Live : https://lnkd.in/g6Sr55kx 🎯 Why this project matters This project demonstrates my ability to translate problem-solving logic into a working application, while maintaining clean code structure and efficient state handling. 💡 Key Learnings • Strengthened logical thinking and game design fundamentals • Improved handling of user interactions and edge cases • Learned to write clean, modular, and maintainable code. #projects #web development #javascript
To view or add a comment, sign in
-
More from this author
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