A front-end for my pet project "Canvas", an interactive app where multiple users over the internet can collaborate or compete on an online grid.
I wanted to explore back-end development as a fun learning activity and built this simple website to visualize and interact with the grid aka the Canvas.
In its current status is nothing more than a proof of concept, but fully functional 24/7, it just may not be as fun as I intended.
It started as a clone of r/place I thought: what if the activity isn't draw pixellated pictures but the canvas evolves over time according to some background logic (could be a game, could be anything). Check out the back-end code at this repo. Technologies I touched during develoment of this front-end, which may or may not be present in the current embodiment.
- HTML
- CSS
- Javascript
- Typescript
- Angular
- React
- HTTP
- HTTPS
- Websockets (WS and WSS)
The website is deployed/hosted in github pages and also accessible via the domain www.pixels.today The original idea is to have a daily/weekly/monthly game to keep people check out the site regularly. Let's see how far I get into it. As of Feb-2023 the two apps I implemented is a simple pixel placement (the grid is static), and a Space Invaders clone with a twist: players can have the aliens shoot, so they can side with either humans or invaders.
I'd like to (maybe):
- Have an overview of the current state (like, who's winning, or how many victories per team)
- Add a chat or live-feed of events ("John Doe destroyed Alien!")
- Add more games and automatically switch between them every X days
nothing else, I want to keep it minimal (kind of like Wordle and r/place).