Click on the colors below the color box to change the color of the box! (The name Pong comes from the initial idea for the project but we switch last minute)
- Anita Bangali
- Johnny Quinn
Color Box is an app in which clicking the names of different colors changes the color of the box. This project was built with Node, Express, and Socketio.
User clicks button element on frontend -> event listener triggers socket.emit(‘color change’) to backend server -> backend server detects color change then triggers io.emit(‘color change’) to frontend -> frontend detects with socket.on(‘color change’) and executes code to change color of box
When one user clicks a color to change the color of the box, it does so for all other users. In order to change the color of the box in other users' clients the implementation of Websockets is necessary.
git clone https://github.com/bangalia/Pong.git
In terminal within the main directory:
npm run dev