Browser preview
A live preview of your app appears in the right panel of the editor. It updates automatically as the AI makes changes.
The preview shows your app running through a React Native web build. It’s a good approximation, but some elements may look slightly different than on a real device.
The browser preview cannot simulate native device features like camera, biometrics, NFC, Bluetooth, push notifications, or native date pickers. Use a physical device for testing these features.
Testing on your phone
For the most accurate experience, test on a physical device:
- Install Expo Go on your iOS or Android device
- Open the QR code tab in the preview panel
- Scan the QR code with your device camera (iOS) or the Expo Go app (Android)
- Your app loads on your device with live updates
Your phone and computer need to be on the same network for live preview to work.
What works where
| Feature | Browser Preview | Physical Device |
|---|
| UI layout and styling | Yes | Yes |
| Navigation | Yes | Yes |
| State management | Yes | Yes |
| Forms and inputs | Yes | Yes |
| Camera | No | Yes |
| Biometrics | No | Yes |
| Push notifications | No | Yes |
| Native date pickers | No | Yes |
| Platform-specific UI | Approximate | Accurate |
Preview controls
- Restart Metro — click the restart button if the preview stops responding
- Cache reset — ask the AI to “restart the preview with cache reset” for a clean rebuild
- Error display — runtime errors show with a count badge; click “Fix All Errors” to let the AI diagnose and fix them
Preview states
| State | What’s happening |
|---|
| Loading | Setting up the preview environment |
| Building | Compiling your app code |
| Ready | App is running and interactive |
| Coding | AI is editing code — preview will update when done |
| Error | Build failed — check the error message |
