Appsmith

While Appsmith has connectors for some APIs, it’s much faster to build with Appsmith’s Postgres adapter. You don’t have to worry about rate limits and SQL is both familiar and expressive.

​

Setup a Sequin sync

Before you can use Sequin with Appsmith, you’ll need to create a sync. Sequin will guide you through authenticating, selecting the data you want to sync, and connecting to your database. Read our getting started guide for step-by-step instructions.

​

Create a Appsmith Resource

A datasource in Appsmith is a connection to a resource like Postgres.

Sequin uses a Postgres Proxy to interface with your Sequin-synced tables. The Proxy lets Sequin capture inserts, updates, and deletes you make in your database and commit them to the API.

To add Sequin’s Postgres Proxy as an Appsmith datasource, you can treat it as a regular Postgres resource and enter the connection details in the datasource configuration:

Step 1: Go to your Appsmith dashboard and find “Datasources” on the left rail. Click on the plus icon.

Step 2: Select PostgreSQL.

Step 3: This opens up a new configuration page. Give it a name and paste the values for host, database name, database username, and database password from the Connection instructions tab of your Sequin dashboard.

Step 4: Be sure to set the connection mode to read/write. Then, click “Save.”

​

Using the Postgres datasource in Appsmith

Now, Sequin is syncing your API data to Postgres. You’ve also connected Appsmith to Postgres via Sequin’s Proxy. To query this data in your Appsmith app, go back to your Appsmith dashboard and select your app:

Step 1: From the Appsmith dashboard, click “Edit” on your app.

Step 2: Find “Queries/JS” on the left rail. Click on the plus icon.

Step 3: In the list of datasources, select the Postgres connection to Sequin.

Step 4: Compose your query. The schema for your Sequin-synced tables is available on the right rail.

Step 5: Click “Run” in the top right to make sure your query runs as expected.

Here’s an example Salesforce query that finds all the Salesforce Contacts belonging to a given account:

select * from salesforce.contact
-- assumes an Appsmith input named `account_id_search` on the canvas.
where account_id = {{account_id_search.text}}
limit 100;

​

Writing back to the API

With Sequin, you can also make mutations via your database as well. Inserts, updates, and deletes you make to Sequin-synced tables are first applied to the API. If they pass validation, they’re committed to your database.

To write your first mutation query, find “Queries/JS” on the left rail again and click on the plus icon.

You can compose an insert query by populating values with various input fields in your application. For example, if you have a form with inputs named first_name, last_name, and email, the corresponding insert query would look like this:

insert into public.contact (first_name, last_name, email)
values ({{form1.data.first_name}}, {{form1.data.last_name}}, {{form1.data.email}});

To connect the form’s submit action to this query, select the form’s “Submit” button. Find “onClick” in the right rail and set the action to “Execute a query → [your_query].” Now, when the user clicks the “Submit” button on the form, Appsmith will execute the insert query:

​

Errors

When Sequin’s Proxy encounters an error trying to apply your mutation in the upstream API, the Proxy returns a standard Postgres error. You can configure your app to display this as an alert notification:

Step 1: Select the form’s “Submit” button. Find “onClick” in the right rail. Under callbacks, click ”+” to add an “on failure” callback.

Step 2: In the “Configure action” popover, set “Action” to “Show alert.” Set the “Message” to {{[your_query].data}}.

Now, if a user attempts to perform an insert and it fails, they’ll see the validation error that was returned by Salesforce:

​

Next steps

You can now use Appsmith to build on top of sources like Salesforce, Airtable, and HubSpot. If you have any questions, please reach out to us.