Server that uses Web Sockets to create a room for r/place-esque canvas at Socket-Pixels
Details • Key Features • How To Use • Related • License
This is a simple clone of the r/place canvas implemented in HTML, CSS, and JavaScript. The r/place canvas was a collaborative art project on Reddit that allowed users to place colored pixels on a large canvas. This clone project aims to recreate the canvas functionality and allow users to draw on a similar canvas.
- Custom color selection
- Instead of the fixed 16 colors in r/place, select custom colors when creating a room. It's like a box of crayons (but better ofc)
- Custom timeouts
- Set custom timeouts, restricting them on how long they'll have to wait between two pixel places.
- IP-based identification
- Users are identified using their IP addresses so that timeouts can be implemented. Just to try and (hopefully) keep things under control.
- Custom grid sizes
- Select custom grid sizes for the canvas.
- Local database
- To keep things simple and make this server locally hostable, I used a database that stores data locally (tindogb) so that you don't have to worry about setting up a cloud database.
To clone and run this application, you'll need Git and Node.js (which comes with npm) installed on your computer. From your command line:
# Clone this repository
$ git clone https://github.com/chakri68/socket-pixels-server
# Go into the repository
$ cd socket-pixels-server
# Install dependencies
$ yarn install
# Run the app
$ yarn startNote I recommend using yarn for faster downloads (more) TingoDB code can be reused with MongoDB (more)
Socket-Pixels - Svelte Frontend for Socket-Pixels
MIT