Preview App
Confirm a UI change in the running app across routes and screen sizes.
Use Preview App when a change needs real routes, navigation, sign-in, or the surrounding screen to make sense. It runs your app inside Hexby so you can check that behavior before sharing the change.
Preview App shows the running application inside Hexby.
Start the app
- Open Preview App from the workspace sidebar.
- Start the preview if it is not already running.
- Wait for the app to load.
- Use the address bar or the app’s navigation to open a route.
Hexby usually finds the command that starts your app. If it asks for one, enter the command you normally use in a terminal from the app folder. Install the project’s dependencies first. If startup reports missing settings or services, follow Troubleshooting.
Choose a size and inspect
Use the toolbar to navigate, reload, zoom, or switch between desktop, tablet, and mobile sizes.
Turn on Inspect to select something in the running app. The inspection panel shows the selected element’s visible content, properties, and console messages.
Try a temporary edit
Inspect mode can change text, styles, links, images, attributes, or accessibility values for exploration. These edits affect only the preview and reset when it reloads.
When the direction is right, choose Apply changes to ask your connected assistant to make it in the project. Review the updated UI and changed files before keeping or sharing it.
If the app will not start
Check that dependencies are installed, the start command works from the app folder, the port is available, and required environment values are present. Read the first startup error before changing anything. For more help, see Troubleshooting.
Next step
Use Review Changes to compare an updated app with the original.