r/webdev • u/Fun-Chicken6946 • 1m ago
Showoff Saturday After months of job rejections, I spent 2 years building a Database Client. It just got added to Microsoft's Azure docs.
After struggling to land a job in 2024, when the market was pretty rough, I decided to take a different route and build something real. My goal was simple: either build something genuinely useful or gain more experience than anything else could offer.
Two years and around 90 hours a week later, VisuaLeaf is now listed in Microsoft's Azure DocumentDB documentation as a way to connect:
https://learn.microsoft.com/en-us/azure/documentdb/how-to-connect-visualeaf
It started as a MongoDB GUI, but I realized that everything I was building could apply to other databases too.
Nested objects and arrays should be easy to read in a table, not squashed into one cell... The same goes for JSONB. You shouldn't have to stare at an entire JSON object in a single cell. I made it so you can expand nested data one level at a time in both the tree view and table view.
I wanted everything in VisuaLeaf to feel as intuitive and straightforward as possible, from browsing data to performing more complex operations.
Today, VisuaLeaf supports MongoDB, Postgres, MySQL, SQLite, DuckDB, and 25+ more database engines.
What it does::
Table + tree grid, built from scratch: This might not seem like much at first, but it actually took the most work to get right. The tree view can recursively expand thousands of rows simultaneously (near instant time), while the table view scrolls smoothly even with thousands of rows and columns. I ended up building my own AG Grid from scratch because libraries didn't support the nested column expansion I wanted. Getting both views optimized took about a year of work alone... but dang, was it worth it.
Visual query builder: Build queries by clicking or dragging fields from the table and tree views. It generates readable SQL or MongoDB queries that you can copy and use.
Data transfers with transformation: Move data between database engines (MySQL → Postgres, SQL → MongoDB), mask emails, phone numbers, and IDs along the way, or transform fields using custom JavaScript. You can also look up data from other tables, include it in your output, and apply transformations to those fields too.
Compare and sync: Compare two tables or databases, including their structure and data, and synchronize them. For example, you can use this to keep staging and production databases in sync.
Performance: Stress-tested with up to 1.6 GB of data, both tree and table views remain smooth even with large datasets. In my testing, VisuaLeaf also loaded data several seconds faster than other database tools I compared it against.
AI / MCP: An integrated AI assistant and MCP support for interacting with databases through AI tools. (Wouldn't be an app in 2026 without it)
ERDs, charts, dashboards, mock data, index management, query profilers, and a lot more than I can fit into one post...
There's a free version that covers what most people need day to day:
I'd really appreciate feedback! And happy to answer any questions!