kyo144 / drawprism

DrawPrism, a real-time online collaborative paint chat website.

DrawPrism

DrawPrism, a real-time online collaborative paint chat website.

Live Demo

• Home page: https://www.drawprism.space/
• Anonymously, no registration needed but still can sign up if you'd like to. ✨
• Here I also provide a test account for you guys.
  • ID: [email protected]
  • Password: Qwert123

Table of Content

• Main Features
• System Architecture
• Backend Tech Stack
• Front-End Tech Stack
• Net-working
• Version Control
• Contact

Main Features

✨ Create a free paint chat room in a second!

• After create the room, system will give you an url to invite your friends in,
  then you can drawing and chatting together, asynchronously!
• Communication between client-side and server-side is handled through Socket.IO.

✨ Pen Pressure Sensitive

• If you draw by tablet, I have built-in support for pressure sensitivity!

System Architecture

Backend Tech Stack

• Docker / docker-compose
• gunicorn
• gevent / gevent-websocket
• Python / Flask
• Flask-SocketIO
• Celery
• MongoDB Atlas
• AWS ElastiCache for Redis
• AWS S3
• AWS CloudFront
• AWS EC2
• JSON Web Token (JWT)
• MVC Design Pattern
• Ubuntu 20.04 (Windows Subsystem for Linux 2)

Front-End Tech Stack

• React.js (Hooks)
• React Router
• Redux Toolkit / RTK Query
• Socket.IO Client
• Html Canvas API
• Tailwind CSS

Net-working

• Nginx (Reverse Proxy / Http & Https support)

Version Control

• Git / Github
• GUI: Fork / Git Kraken

Contact

• 📲 Juri
• 📨 [email protected]