Retool is a fast way to build internal tools. You can create and modify components using Retool’s drag and drop editor, which allows you to build fully customizable interfaces. You can also connect components to database queries (SQL and NoSQL) or API requests (HTTP, GraphQL, etc.), to display data or trigger actions from any datasource.

The tools you build are hosted in Retool and can be shared using a provided link. You can restrict access to different tools in Retool using access controls, and track the usage of your tools using Retool's audit logs. If privacy and security are required, you can also deploy Retool on your own servers.

Retool comes with an example database and API that you can use to test Retool. This three minute tutorial will walk you through how to use the sample datasources to build an app which can browse, search, and approve users.

1. Create a new account at https://login.retool.com/. If you're prompted to go through the onboarding process, feel free to skip it and create a new blank app instead.

2. The list of components available for use on the canvas is located on the right hand side of the screen. Drag a Text component onto the canvas.

3. Let's customize the text to something more informative. Use markdown in the value input box, to format the text as a Header and change the Text field value to # Users. The text on the canvas will automatically update to reflect the changed value.

You can write queries or create API requests in the query editor located at the bottom of the screen. An example database is provided with some pre-populated demo data. If you have added your own database, you can switch to it using the dropdown at the top left corner of the query editor window.

1. In the code editor, type select * from users;.

To test the query, click the Preview button.

Great job! To start using the data from this query in the rest of our app, you need to save the query. Click Save to save the query.

Create a table component and place it below the Users text component. By default, the table will display data from the most recently saved query. Your app should now look like this:

If you forgot to save the query from the previous step, the table will be pre-filled with JSON placeholder data. To display the data from the query in the table, first save the query. Then change the Data property of the table to {{query1.data}}.

Your table will update and show the data from the query named query1. This links the table’s data to query1.data. Now whenever query1.data changes, the table will automatically update to display the new value of query1.data.

Let’s make this page interactive, and add a search box to the table!

1. Drag a TextInput component onto the canvas and place it above the Table.

2. In the query editor, change the query to the text below and press Save. This updates your query based on the value entered in textinput1. Since table1 is linked to query1.data, when the text changes in textinput1, query1 will automatically re-run and update table1.

3. Now you can search through your users by typing in the search box. Try typing m.

Besides displaying data, Retool enables you to create forms and buttons to trigger actions like updating your database.

1. Create two Button components. Change one button label to Approve and the other button label to Reject. You can also customize the color of the buttons. In this example, we've set the colors to green and red.

2. Let's make these buttons functional! Select the Approve button, then in the dropdown below Run a query select Create a new query. This automatically creates a new empty API query.

3. You can connect APIs to Retool and specify authentication schemes, similar to how you configure database connections. For this tutorial, you’ll use the example API that was provided to you by default. To use the example API, change the Resource dropdown to onboarding_api (restapi).

4. The query editor enables you to construct any kind of API request. Similar to the SQL Editor, you can use {{}} expressions to dynamically generate requests using components from your app.

For the Approve button, let's construct the API request similar to the screenshot below:

• Link the API URL to the table's selected row. This connects the API request to the selected user in the table.
• Add an API payload to approve the selected user.
• Configure Retool to refresh the SQL query query1 if the API call succeeds.

Repeat the API process for the Reject button.

Test the tool by clicking on the buttons, and watch the data in the table refresh. Once you're satisfied with how it works, click the blue Play button at the top right corner of the screen to use the app in a production setting.

That's it! You've built a quick dashboard that enables you approve and reject users using both SQL and API requests.

You can also control who can use the app through access controls and track how people use your app with audit logs. You can find these features by returning to the home page and exploring Retool!