Snake.js
#javascript#web#game#firestore
A vanilla JavaScript snake game with online scoreboard and Firestore integration
🎮 About The Project
This project, SnakeJs is a modern remaster of the classic Nokia snake game, built with vanilla JavaScript. This project was created to kill time while exploring web game development and real-time database integration.
The game features a 30x30 grid (900 squares) with increased speed compared to the original, making it more challenging and engaging. Players can compete globally through an integrated online leaderboard powered by Firebase Firestore.
🎯 Key Features
- Classic Gameplay: Grid-based snake mechanics with smooth controls
- Enhanced Difficulty: Increased speed for a more challenging experience
- Online Leaderboard: Save and compare high scores with players worldwide
- Real-time Database: Firestore integration for instant score updates
- Vanilla JavaScript: No frameworks, no canvas, pure JS and SCSS implementation
🛠️ Technical Stack
- Frontend: Vanilla JavaScript, HTML5, Sass (SCSS)
- Database: Firebase Firestore (real-time data storage)
- Deployment: Vercel
- Base Template: Inspired by this repo: Kubowania's Nokia3310-Snake
🎲 How to Play
- Visit snaake.vercel.app
- Use arrow keys to control the snake
- Eat the food to grow longer
- Avoid hitting the walls or yourself
- Try to beat the high scores on the leaderboard!
💡 What I Learned
This project was an excellent opportunity to:
- Work with vanilla JavaScript without frameworks or Canvas
- Discover and Integrate Firebase Firestore technology for real-time data
- Implement game logic and collision detection
- Create an engaging user experience with simple tools
🔗 Links
- Live Demo: snaake.vercel.app
- GitHub Repository: KaazDW/Snake-js
This project demonstrates my ability to create interactive web applications using vanilla JavaScript and integrate cloud services for real-time functionality.
