Draw it er en real-time kollaborativ lærredsapplikation udviklet ved hjælp af Flutter til frontend og Node.js + Express med WebSocket til backend-synkronisering. Appen giver flere brugere mulighed for at tegne samtidigt på en delt tavle og demonstrerer ekspertise i både udvikling af grænseflader på tværs af platforme og netværkskommunikation i realtid.
🚀 Nøglemål:
Aktiver problemfrit samarbejde i realtid på et fælles tegnebræt ved hjælp af en effektiv, begivenhedsdrevet arkitektur.
🧱 Tech Stack:
Flutter (Dart): Mobile frontend på tværs af platforme med gestushåndtering og tilpasset gengivelse
Node.js + Express.js: Backend-server med WebSocket-understøttelse til vedvarende tovejskommunikation
WebSocket (ws): Til realtidssynkronisering af streger på tværs af brugere
CustomPainter: Effektiv billed-for-ramme-tegning på lærred
Permission Handler & RepaintBoundary: Gem tegninger som billeder på enheden
🖌️ Kernefunktioner:
✍️ Delt realtidstegning: Alle deltagere ser hinandens streger øjeblikkeligt ved hjælp af WebSocket-udsendelse.
📡 Stateless WebSocket Server: Letvægts Node.js-server vedligeholder aktive socketforbindelser og videresender slaghændelser med lav latenstid.
🎨 Canvas Engine: Berøringsbevægelser konverteres til tegnebare vektorbaner og gengives ved hjælp af Flutters CustomPainter.
📁 Eksporter lærred: Brugere kan gemme deres illustrationer som et billede
🔧 Modulær arkitektur: Separate lag til tegning af logik, serverhændelser og platformintegration.
Tegn, doodle og skab frit - dit lærred, dine regler