Skip to main content
Developer tools in preview help you understand what your app is doing while you build it. You can see which files power the page you are looking at and monitor every request your app makes as you interact with it. This makes it easier to find the right file to edit and to debug issues such as missing data or failing calls.

​
Viewing files used in a page

Use Files used in this page to see which app files power the page you are previewing. It shows you exactly which code files are running so you know where to go when you want to edit the page or investigate an issue. Each entry in the list shows the file name and its folder path, grouped by where it lives in your project, such as pages or components/dashboard. This gives you a quick map of the files behind the UI you see in preview and helps you understand how a complex screen is put together. To open the files used on a page:
  1. Go to your app editor.
  2. Click the More Actions icon at the top right.
  3. Click Files used in this page.
Viewing files used on a page of your app

Viewing files used on a page of your app

Tip: If you want to move from this focused view into the full file structure, click See all files. This takes you to the complete code files view so you can keep exploring from there.

​
Using the activity monitor

Use Activity monitor to see every request your app makes while you are in preview. You can check which endpoints are called, see status codes and timing, and inspect request and response details to debug problems. For each entry you can see the method, such as get or post, the path, such as /entities/Notification, when it happened, and the status code, such as 200, shown on the right. You can then use the search field at the top left of the panel to filter entries by method, path, or other text. Click the filter at the top right of the panel to focus on specific types of entries. To open the activity monitor:
  1. Go to your app editor.
  2. Click the More Actions icon at the top right.
  3. Click Activity monitor.
Accessing the activity monitor in your app editor

Accessing the activity monitor in your app editor

To inspect a single request, click the relevant entry in the list in Activity monitor. In the details area, click the General tab to see the full URL, the HTTP method, the status code, the total time, and when the request started and completed. Then click the Request tab to review what your app sent, including headers, query parameters, and the request body when it is available. Finally, click the Response tab to review what the endpoint returned, including response headers and any response body or error message.
Investigating a request in the activity monitor

Investigating a request in the activity monitor

Use this information to confirm that your app sends the expected data and that the backend returns what you expect.

​
FAQs

Click a question below to learn more about developer tools in preview.
No. These tools are only available to you and your app collaborators while you are in preview. People who use your published app do not see these panels or any of the data inside them.
Start by opening the failed entry and checking the Status and Response tabs. Look at the status code, any error message in the response body, and key headers, such as authentication. From there, use Files used in this page to open the file that triggers the request so you can fix the logic.
Yes. The Time values in the General tab show how long each request takes. You can click through slow calls to see which endpoints or flows are taking the most time and then focus on improving those specific parts of your app.