Retool Mobile overview

Retool Mobile is a complete solution for building mobile apps that run natively on iOS and Android, and on the web as progressive web apps (PWA). You connect your data sources, visually build your app's interface, and write queries to interact with your data. You can also use mobile device functionality, such as NFC readers or cameras.

Retool makes all of your mobile apps available in the Retool Mobile app for iOS and Android. You use this app, you browse, search, and run any of your organization's Retool Mobile apps natively.

Build Retool Mobile apps

You build mobile apps using the App editor for Retool Mobile, Retool's drag-and-drop app building web interface. You use the App editor to:

• Visually assemble the mobile app interface.
• Write queries to interact with data.
• Configure actions based on user interactions.
• Share apps directly with users.

Mobile app interface

The UI of Retool Mobile apps consists of screens and components:

• Screens separate the interface into multi-page layouts required for mobile apps.
• Components are interface elements, such as input fields, that each screen contains.

The App editor includes an additional mobile panel on the left to manage screens and components.

You configure screens and components using the Inspector in the right panel. You can use event handlers to trigger queries or other actions in response to user events, such as pressing a button, navigating to another screen, or using the pull-to-refresh gesture.

Mobile screens

Retool Mobile apps contain separate screens to serve different purposes. Only a single screen is visible to a user at any one time. Users can navigate between screens using interface elements like a tab bar, or interactions that trigger event handlers.

Mobile components

📘

You can only use Retool Mobile components to build mobile apps.

Retool's mobile-specific components are the fundamental building blocks of Retool Mobile apps. They are prebuilt interface elements designed for mobile devices to display data, allow user input, and trigger actions based on interactions.

You assemble mobile components for each screen to perform a certain task (e.g., a list of contacts). Any changes to the component's state are immediately reflected.

Handle user interactions

You can configure screens and components with event handlers that trigger queries or other actions in response to user events, such as pressing a button, navigating to another screen, or using the pull-to-refresh gesture.

Run Retool Mobile apps

Retool Mobile eliminates the need for compiling apps, complex distribution, and store listings with lengthy reviews. Instead of separate apps, you use a single app—Retool Mobile for iOS and Android—to browse and run apps natively. Retool Mobile apps also function as progressive web apps.

This approach simplifies deployment and makes all Retool Mobile apps instantly available. You can share links to apps so users can launch them on their device, or open them in a browser.

Natively with Retool Mobile for iOS and Android

The Retool Mobile app for iOS and Android uses React Native to run mobile apps natively. Users can log in to their Retool organization, browse or search for mobile apps, and launch them on their mobile device.

You can share Retool Mobile app links with users to launch them automatically in the Retool Mobile app. If a user doesn't have the app installed, they are automatically routed to the Apple App Store or Google Play.

On the web

You can also launch Retool Mobile apps as progressive web apps (PWA). This makes it possible to use Retool Mobile apps on a wide range of devices that are unable to use the Retool Mobile app for iOS and Android (e.g., Amazon Fire tablets).

Retool Mobile apps viewed on the web include a QR code that can open the app directly in Retool Mobile.

Functionality considerations

Some functionality supported by Retool is not available in Retool Mobile due to restrictions or limitations when apps run natively.

General limitations

Certain functionality supported by desktop Retool web apps are not available in Retool Mobile. As you build Retool Mobile apps, keep these considerations in mind to ensure a consistent and seamless experience.

In addition, certain versions of Android:

• Use older versions of Node.js (e.g., v10.15.3) that do not support some functionality, such as Set and flatMap(). Refer to Node.js ES2015/ES6, ES2016 and ES2017 support to learn what functionality of Node.js is available in the version available for Android.
• Do not support existential operators, (e.g., foo?.bar).

JavaScript limitations

Certain JavaScript features are unavailable. This includes:

• Access to the Window object.
• Some third-party JavaScript libraries, including those directly available in Retool.
• Base64 encoding and decoding using btoa() and atob().
• Use of toLocalDateString(). You can use the third-party Moment JavaScript library, which is built into Retool and is available natively.

Interactions using the web console are also unavailable in Retool Mobile. This includes console.log() or running commands using the Console tab of Debug Tools. Instead, you can use components to display output by setting their values (e.g., Text Area) or Run JS Code JavaScript queries to perform certain commands directly in the App editor.

Android limitations

Certain versions of Android also rely on older versions of Node.js (e.g., v10.15.3). These older versions lacks support for some functionality. This includes:

• Set.
• flatMap().
• Existential operators, (e.g., foo?.bar).

Refer to Node.js ES2015/ES6, ES2016 and ES2017 support to learn what functionality of Node.js is available in the version available for Android.

Testing and debugging

You can use Retool's Debug Tools to explore your Retool Mobile app, review errors, and debug issues during development. You can also use the Model browser in the left panel of the App editor to explore all component and query properties.

Retool Mobile does not support interactions using the web console. This includes console.log() or running JavaScript using the Console tab of Debug Tools. Instead, you can use components to display output by setting their values (e.g., Text Area) or Run JS Code JavaScript queries to perform certain commands directly in the App editor.

Compare Retool Mobile with Retool on the web

📘

It is not currently possible to convert an existing Retool web app to Retool Mobile.

You build Retool Mobile apps using the same tools and workflows to build web apps on Retool. As you consider using Retool Mobile, there are some differences to keep in mind and certain functionality not available in mobile apps.