Important note: You might have to lower your sound before playing a game :)
Snake is the common name for a video game concept where the player maneuvers a line which grows in length, with the line itself being a primary obstacle. The concept originated in the 1976 arcade game Blockade, and the ease of implementing Snake has led to hundreds of versions (some of which have the word snake or worm in the title) for many platforms.
The player who goes out of the grid loses, also if there a collision between the two players, the player who caused the collision loses the match
- Concepts
- Chosen concept
- What does this app do?
- Wishlist
- Real-time events
- Data flowchart
- Used packages
- Install the app
- Sources
Getting realtime twitter tweets with filters, so if i setup a filter to retrieve tweets with the hashtags: programming, I will only receive these in my overview which I can also archive or save it into the database.
2 players will battle each other in a snake battle, This game allows multiple users to control their own snake, the best snake that survives the longest, wins the game. The player can choose to make a new room or invite friends into their room.
The concept that I've chosen is: Multiplayer snake game
- Create room
- Join room (with gamecode)
- Detects how many players are in the room
- Copy gamecode
- Play a harder version of snake
- Plays music during the match (Doom 🔥)
- Detects if player goes out of grid
- Detects if there is any collision between the players
- Supports 2 players at a time
- Supports seperate rooms
- Create room for players to join the game
- Other player is able to join the room
- Player is able to see their gamecode and send invite link
- In each game there is a winner
- Snake food is begin generated in the grid
- Collision is detected || if player goes out of the grid
- Snake is getting longer after eating food
- Match has a countdown before the game begins
- Setup database for scores/time
- Choose snake color
- Choose game theme
- Change models
- Have a quick rematch with your opponent
New game
Makes a new game room with a unique ID for the players to play in that room
Join game
Join the game with a unique code, the server checks if this is a valid code or not
Keydown
Every button presses (arrows) are being captured and sent the server, to calculate the new position of the snake
emitGameState
Check if the game already started or not
emitGameover
If the game is over, return the winner of the game
dotenv :
Dotenv is a zero-dependency module that loads environment variables from a .env file into process.env. Storing configuration in the environment separate from code is based on The Twelve-Factor App methodology.
ejs :
Embedded JavaScript templates
express :
Fast, unopinionated, minimalist web framework for node.
express-router lets you write your express routes in a simpler way. You just have to create a 'routes' folder inside your project and place your routes in an index.txt file.
nodemon is a tool that helps develop node.js based applications by automatically restarting the node application when file changes in the directory are detected.
Socket io enables real-time bidirectional event-based communication
Firebase provides the tools and infrastructure you need to develop, grow, and earn money from your app. This package supports web (browser), mobile-web, and server (Node.js) clients.
uuidv4 creates v4 UUIDs
git clone https://github.com/RowinRuizendaal/Multiplayer-Snake.git
Cd to the multiplayer snake game directory and:
NPM install
or install it with yarn:
Yarn install
Once you have installed the project, execute the following command within your code editor:
npm run dev
Chris DeLeon of HomeTeam GameDev. (2017, May 5). Coding “Snake” in 4 min 30 sec (plain browser JavaScript). YouTube. https://www.youtube.com/watch?v=xGmXxpIj6vs
Create a Copy Button Without an Input Text Box. (2018, June 11). Stack Overflow. https://stackoverflow.com/questions/50795042/create-a-copy-button-without-an-input-text-box/50795833
E. (n.d.). JavaScript Snake Game Tutorial: build a simple, interactive game. Educative: Interactive Courses for Software Developers. https://www.educative.io/blog/javascript-snake-game-tutorial
Get started. (2021, April 19). Socket.IO. https://socket.io/get-started/chat
how to get socket.io number of clients in room? (2015, July 17). Stack Overflow. https://stackoverflow.com/questions/31468473/how-to-get-socket-io-number-of-clients-in-room
npm: dotenv. (2019, October 16). Npm. https://www.npmjs.com/package/dotenv
npm: ejs. (2021, February 6). Npm. https://www.npmjs.com/package/ejs
npm: express. (2019, May 26). Npm. https://www.npmjs.com/package/express
npm: express-router. (2012, August 24). Npm. https://www.npmjs.com/package/express-router
npm: firebase. (2021, April 13). Npm. https://www.npmjs.com/package/firebase
npm: nodemon. (2021, January 6). Npm. https://www.npmjs.com/package/nodemon
npm: socket.io. (2021, April 1). Npm. https://www.npmjs.com/package/socket.io
npm: uuidv4. (2021, March 25). Npm. https://www.npmjs.com/package/uuidv4
Perform simple and compound queries in Cloud Firestore |. (n.d.). Firebase. Retrieved April 23, 2021, from https://firebase.google.com/docs/firestore/query-data/queries#node.js
vuurvos1 :
Helping me with Math logic