Canvas Saver
Canvas Saver helps content creators use tldraw to create complex presentations without worrying about losing their work.
About
The problem it solves Tldraw is a powerful canvas creator I've used to make educational content for developer education. The out-of-the-box feature set is fairly robust but is missing some wants/needs I have as a content creator. One of these is the reliable persistence and storage of canvas creations. The default process relies on copying a "snapshot" link generated by tldraw. Sharing this link does allow users to interact with the canvas however, there is no way to recover the canvas if you lose your link and don't have it stored locally. Sadly, I lost hours of work before I learned this painful lesson! Canvas Saver solves this problem by capturing a snapshot JSON object, and storing it to Arweave via Irys SDK using the Coinbase Smart Wallet and Base Eth/Sepolia to pay for the storage. Irys provides a mechanism for searching for uploads based on your wallet address so I can always find my canvas even if I lose the gateway url to serve it.
How it's made
Challenges we ran into I started with a template repo from the devrel at Irys. It was initially challenging to convert the utility functions to handle my canvas JSON object but I worked it out with the help of some Google-fu and ChatGPT debugging. I made sure to use the commit history and README to explain which parts are the template and which parts I added/customized.