Advanced Query Builder
Location: Sidebar → Advanced Query Builder
The Advanced Query Builder exposes the full Supabase JS client method chain, giving you precise control over every aspect of a query. The advanced query builder lets you craft complex queries with ease and immediately shows you the JavaScript needed to run them. It’s a fast way to prototype, validate, and then drop working queries straight into your codebase. It also works in reverse: you can easily reconstruct your existing queries visually, and experiment with variations to diagnose issues or refine the logic.
How It Works
Queries are built as a series of ordered chain steps. Each step represents one method call on the Supabase client. Steps fall into four phases that must appear in order:
| Phase | Purpose |
|---|---|
| Origin | from() — specify the table |
| Operation | select, insert, update, upsert, delete |
| Filter | Any filter method (e.g. eq, ilike, in, or) |
| Modifier | order, limit, range, single, maybeSingle, csv, explain, throwOnError, returns |
Building a Chain
- The from() step is added automatically when you select a table.
- Click Add Step to append a method from any phase.
- Configure each step's parameters in the inline form.
- Steps can be reordered by drag, enabled/disabled individually, or deleted.
- Select an auth context and click Run Query.
JSON Templates
For insert, update, and upsert steps, the app will auto-populate a JSON payload based on the table's schema columns. Edit the values as needed.
Nested Selects
Use the select step to build nested resource queries, e.g. *, posts(id, title) to fetch a user and their posts in a single request. When you have included nested tables in a query the autofill on additional steps will include nested table columns for you to select from.
Disable Steps
If you have a complex multi-step filter configuration that you are diagnosing, you can use the "Disable Step" eye button to easily turn off steps in your chain so you can see where data is getting filtered from the results and correct your query.
Code Preview
A live code preview updates in real time as you modify the chain. Copy it directly into your application.