Show HN: Extracting React apps from Figma Make's undocumented binary format

Summary

A client came to me with a beautiful UI. They’d built it in Figma Make, the AI-powered prototyping tool. The app looked stunning, animations were smooth. Just one problem: I couldn’t get to the actual code. Normally you can use the api or export design files, but not with Make. The Figma API Returns {"status":400,"err":"File type not supported by this endpoint"} for Make files. Why would you not be able to do that? The wonders of corporate lock-in, I suppose. That’s a problem: no design file. What now? So on to searching for ways to extract the code. So I started clicking around the Figma interface, looking for anything useful. That’s when I noticed you can download the .make file itself. Download. A file, interesting! But I can not read it. Hmmm, what now? Rule number one: never trust the extension. A .make file could be anything. After a while I figured out it was a ZIP file. And in it was in essence a React application. Photo by Markus Winkler The Discovery: It’s Just a ZIP File First thing I did was look at the raw bytes: xxd -l 4 "ClientApp.make" # Output: 504b 0304 504b is PK in ASCII. That’s the ZIP file signature. The whole mysterious .make file is just a ZIP archive with a different extension. Learned something new today (about 504b). Unzip it: ClientApp.make (ZIP) ├── canvas.fig # 2.3 MB binary - the interesting part ├── meta.json # Project metadata ├── ai_chat.json # 34 MB of AI conversation history ├── thumbnail.png # Preview image ├── images/ # 110 image assets (hash-named, no extensions) └── blob_store/ # Additional binary data The ai_chat.json was massive. Every prompt, every response, every iteration the client went through while building the app. Not very useful, and not what I needed. (although i did try to extract design tokens from it at first, before turning to the binary file). The canvas.fig file held the actual code. 2.3 MB of binary data. That extension sounds more like a standard Figma design file. How to read that and see if it contains an...