The problem ZKTools.dev solves

This is an easy to use web debugging tool for ZK developers and learners (like us!). We wanted to provide a simple UI (inspired by the great evm.code) for everyone to get important information about the process of working with ZK files.

The frontend also adds a lot of tooltips and explanations that are great for people who are getting started with the ZK technology.

Challenges you ran into

• Most JS libs related to ZK are not easy to run in the browser, for instance, circomjs or r1csfile. We lost a fair amount of time trying to setup the build for these libs. We ended up using the very great snarkjs lib but even the file import/read could be improved. We can send PR to these repos to improve the whole JS “flow”.
• snarkjs loads the file with fetch, therefore, we can not directly use the file uploaded by the user. As a workaround, we create presets. A long term solution would be to adjust the snarkjs lib to accept not only a string (path to a file to fetch) but also a node File object or Bytes buffer.
• The whole “zk” flow is quite hard to grasp, as the user needs to work with many files, generated at different stages (such as ceremonies, etc.). It was a great learning experience for us and also make us confident that this tool can help users, learnings, developers, to get around this complex flow.

Technology used

• Next.js - for the React framework.
• Vercel - for the easy deployment.
• snarkjs - for interacting with the zk related files.
• circom - to write and compile circuits.
• Monaco Editor - to edit JSON files.

Future improvements

• We can connect the debugger to the blockchain to fetch the verification directly.
• Adjust the file reading mode so we can easily read file from users device.
• Add more explanation and interactive UI.
• Make all files updatable. At the moment, we had to prepare a few files (“preset mode”) to simplify the process, ultimately, we want users to be able to load their own files.

✨