π© Poop Collection π©
Mini Project: Date: 27 - Aug - 2020
Description
A collaborative multiple player online game where YOU can be a
Deploy
Screenshot
Tech-Stack
Server:
-
Dependencies
- ExpressJS
- Socket.io
- morgan
-
DevDependencies
- nodemon
Client:
- HTML/CSS
- Javascript
Plan Of Action
- Set up project with express
- First layout
- Connect Socket to server
- Connect Socket to client
- Create array of emoji
- Update location of Emoji with random function
- update logic of poop location
- remove poop onClick function
- update score function
- Send ID to server by socket when onClick poop
- Logger connected clients
- Render score when poop Click
- Update Logic for Poop is not re-render many times when users click many times
- Rate Limiting for onClick - 1 second
- Refactor:
- createAnimal function
- createPoop function
- Move Animals function in server
- Refactor:
- collectPoop function
- removePoop function
- Styling for animal move
- Move Animals function in client
- Style grow & shrink animation poops
After this project
I have improve my knowledge about
- Socket.IO
- animation styles with css
I have understand about
- Javascript ES6
- VanillaJS
- OOP with JS
Next Steps:
- Deploy to GCloud App Engine
Directory Structure
.
βββ .gitignore
βββ package.json
βββ package-lock.json
βββ README.md
βββ public
βββ fonts
βββ fonts.css
βββ images
βββ fence.png
βββ app.js
βββ index.html
βββ styles.css
βββ src
βββ index.js
βββ socket.js
Set up
git clone
npm install
npm start