Building a $1-per-square world canvas on Netlify Functions + Supabase
I built WorldCanvas: one shared online canvas where anyone can claim a 20×20 px square for $1 and put their own picture on it. It's a take on the 2005 Million Dollar Homepage, but for people's pictures instead of ads. This post is about how it works under the hood. Honest status first: it's live, I'm building it solo (with an AI coding assistant), and the only two squares on the canvas are my own…
WorldCanvas is an online canvas where users can claim a 20x20 pixel square for $1 and add their own image. It aims to provide a space for personal pictures rather than advertisements. The project is built on Netlify Functions using Node.js, Supabase for database and storage, PayPal Orders API v2 for payments, and Resend for email notifications.
The developer uses jimp, a pure JavaScript image processing library, instead of sharp due to compatibility issues. The canvas is tiled into 400x400 pixel sections, and only the affected tiles are re-rendered upon changes. Images are processed using perceptual average hash to detect duplicates, and a human moderator checks every uploaded image.
Payments are authorized without immediate capture, allowing the user to approve or reject the claim within three days. After approval, a certificate image is generated and emailed to the buyer. The author suggests downscaled copies should be stored initially, starting with a smaller grid, and implementing reauthorization and automated moderation for future improvements.
Written by urgent.news from Dev.to's reporting — not their text. Machine-written — may contain errors; check the original before relying on it.
