I built a Figma-like canvas editor for App Store…
0 reactions
I built a Figma-like canvas editor for App Store screenshots using Fabric.js + React
Sharing my experience building a browser-based design tool:
Stack:
\- Fabric.js for the canvas (text, shapes, images, device mockups)
\- React + Zustand for state management
\- Appwrite for backend (auth, DB, storage)
\- AI-powered translations (Claude via OpenRouter)
\- Vercel serverless for webhooks
Biggest challenges:
1. Canvas performance with many objects — solved with lazy page rendering
2. Font rendering across languages — CJK, Arabic, Thai all behave differently
3. Undo/redo with complex canvas state — snapshot-based history stack
4. Real-time translation preview without re-rendering everything
The result: shotlingo.com http://shotlingo.com — design App Store screenshots and translate to 40+ languages.
Happy to dive deep into any technical aspect.
#programming #dev #technology
source
Sharing my experience building a browser-based design tool:
Stack:
\- Fabric.js for the canvas (text, shapes, images, device mockups)
\- React + Zustand for state management
\- Appwrite for backend (auth, DB, storage)
\- AI-powered translations (Claude via OpenRouter)
\- Vercel serverless for webhooks
Biggest challenges:
1. Canvas performance with many objects — solved with lazy page rendering
2. Font rendering across languages — CJK, Arabic, Thai all behave differently
3. Undo/redo with complex canvas state — snapshot-based history stack
4. Real-time translation preview without re-rendering everything
The result: shotlingo.com http://shotlingo.com — design App Store screenshots and translate to 40+ languages.
Happy to dive deep into any technical aspect.
#programming #dev #technology
source
| 4,000 mlx | |
| 5 | |
| 0 |