Skip to main content
Import API definitions from Postman, cURL, Swagger, or OpenAPI specs. Rocket generates all the connection code, error handling, and data mapping. You pick the endpoint and the UI element.
API imports are only available on the web browser. They are not supported in the Rocket mobile app.

​
What you can connect

Payment processors

Stripe, PayPal, or any payment API with checkout flows, subscriptions, and invoicing.

Databases and backends

Supabase, Firebase, your own REST API, or any backend that exposes endpoints.

Third-party services

Weather APIs, maps, social media, shipping, SMS, email, and any service with a REST API.

Your own APIs

Internal microservices, staging environments, or any custom backend you have built.

​
Before you start

You need one of the following:
  • A Postman API key and workspace
  • A working cURL command
  • A Postman collection export file (postman.json)
  • A Swagger or OpenAPI spec (JSON or YAML)
You also need any environment variables your API definitions reference, such as base_url or accessToken.

Learn how to manage secret keys as environment variables.

​
Open the APIs panel

Click the ... button in the preview toolbar and select APIs.
Toolbar dropdown with APIs option highlighted.Toolbar dropdown with APIs option highlighted.

​
Import APIs

In the APIs panel, open the Select an API dropdown and click Add APIs to open the import dialog. Pick one of four import methods.

Postman key (workspace import)

Use this when your APIs already live in a Postman workspace.Get your Postman API key:

Visit Postman’s documentation to learn how to generate your API key.
  1. Click your avatar in the Postman header, then click Settings.
  2. Go to API keys and click Generate API Key.
  3. Enter a name and copy the key.
Your Postman API key provides access to any Postman data you have permissions for. Keep it private and rotate it if you believe it has been exposed.
Import into Rocket:
  1. In Add APIs, select the Postman tab.
  2. Paste your Postman Key.
  3. Select the workspace.
  4. Click Submit, then select the collections or folders you want to add.
  5. Click Add APIs.
Postman import tab showing key input and workspace selection.Postman import tab showing key input and workspace selection.
Use this when you have a working request you can paste.
  1. In Add APIs, select the cURL tab.
  2. Paste the full cURL command.
  3. Click Add API.
cURL import tab with command input field.cURL import tab with command input field.
Make sure the cURL includes the correct URL, headers, and auth format. If it uses environment variables, map them to your project’s variable format after import.
Use this when you have a Postman export file.
  1. In Add APIs, select Upload JSON.
  2. Drag and drop or upload your postman.json.
  3. Click Submit.
Upload JSON tab with file upload area.Upload JSON tab with file upload area.
Use this when your backend provides an OpenAPI spec.
  1. In Add APIs, select Swagger.
  2. Drag and drop or upload your Swagger JSON or YAML file.
  3. Click Submit.
Swagger import tab with file upload area.Swagger import tab with file upload area.
If your spec defines multiple servers, confirm the base URL matches your environment.

​
Integrate an API into a UI element

This connects an endpoint to a screen element so Rocket generates code tied to a real component.

​
Select a route and API

In the APIs panel, choose the route (the screen or page path, for example /dashboard or /settings) where the API should run, and select the API from the Select an API dropdown. Then click Integrate API.
Route selection and API dropdown with Integrate API button.Route selection and API dropdown with Integrate API button.

​
Click a UI element

After clicking Integrate API, element selection activates. A tag bar appears at the top of the preview showing the available elements. Click the UI element where you want to attach the API.
Element tag bar showing div and span options for API attachment.Element tag bar showing div and span options for API attachment.
Full screen view of element selection with API dropdown and preview visible.Full screen view of element selection with API dropdown and preview visible.
Attach to a stable container element that is always present on the screen. Avoid conditional elements that may not exist on initial render.

​
Configure the trigger

After selecting the element, the When to call this API? dialog opens. Fill in:
  • When should this API run (the trigger, e.g. “On page load”, “On click of Submit button”)
  • Pre API call Instructions (validation, auth checks, token refresh)
  • Post API call Instructions (store response, handle errors, navigate on failure)
When to call this API dialog with trigger, pre-call, and post-call instruction fields.When to call this API dialog with trigger, pre-call, and post-call instruction fields.
Click Submit and Rocket generates the integration code. Pre-call tips:
  • Validate required variables exist (base URLs, IDs, query params)
  • Check auth state (token exists, not expired)
  • Refresh token here if possible
Post-call tips:
  • Store response data into a named state variable your UI can bind to
  • Cache successful responses to improve performance
  • Handle error states with clear user feedback
  • Navigate when needed (e.g. redirect to login on 401)
Clear pre and post-call instructions help Rocket generate robust error handling code.

​
Edit an API response

To update a mock or expected response for an API, open the Add/Edit API Response dialog for that endpoint and paste the updated JSON, then click Update.
Add/Edit API Response dialog showing JSON response content.Add/Edit API Response dialog showing JSON response content.

​
Troubleshooting

Import did not complete, or you imported into a different project. Reopen Add APIs and verify your source: check that your Postman API key is valid, that your Postman workspace contains collections, and that you are importing into the correct project.
The imported definition includes placeholders. Map them to known state variables or environment variables. Set any placeholder like accessToken to reference your stored token value and confirm the request uses the correct auth scheme (e.g. Authorization: Bearer <token>).
Response data is likely not stored to the variable your UI is bound to. Update the Post API call instructions to store the response, then bind your UI list or widget to that variable.
Token is missing, expired, or not attached correctly. Fix in Pre API call instructions and ensure auth header formatting is correct (e.g. Bearer <token>).

​
What’s next?

Chat interface

Build and iterate on your app through natural conversation.

Inject custom code

Add scripts, embeds, and UI components from external sources.

Integrations

Some services have dedicated integrations that are simpler than raw API imports.

Code tab

Browse and edit your project’s source files directly.