Build APIs with Data
Connect your Database, APIs and write Javascript or Python business logic. Reference previous Steps and Components to make your application dynamic
On this page:
What are Superblocks APIs?
Superblocks APIs are the business logic layer of your application on top of your datasources, they serve a response to your Components in the User Interface.
In the example below, we query the Zendesk GET Ticket API, then get the associated customer orders from Postgres, get the order shipping data from Snowflake and merge and transform the Postgres/Snowflake output using Python
Working with Superblocks APIs
Referencing Component Data
You can use {{}}
in SQL / REST / GraphQL steps to reference components in the Canvas, for example:
To reference other components you can write:
{{Input1.text}} //The value of the input
{{Table1.selectedRow.city}} //The selected row JSON object from the Table
{{Chart1.selectedData}} //The selected data point JSON object from the Chart
{{Dropdown1.selectedOptionValue}} //The option selected in the Dropdown
info
Tip The curly braces evaluate to JavaScript and are not needed in JavaScript or Python steps
Referencing a previous Step in the API Builder
{{Step1.output}} //The JSON output object from the Step1
{{Step1.output[0]}} //The object at index 0 of the array
{{Step1.output[0].product}}} //The product property of the 0th index
Using an API Response to fill Components
APIs respond with the output of the final step in the sequence. You might want to use this in the Table Data, Chart Data, Dropdown Data, Grid Data and other related data entry fields.
{{API1.response}} //Give the APIs response object, the output of the final API stp
Running an API on Component Event Handler
Superblocks Components have Event Handlers such as:
- onSelectedRow for Tables
- onOptionChange for Dropdowns
- onClick for Buttons
Whenever these event handlers fire, you can run an API from these Component fields in the properties panel by writing:
{{API1.run()}} //Runs API1 every time the Component Event Handler is triggered
Configuring UI Notifications
By default, when an API fails to run it will send an alert in the UI that an error was hit.