Preview

The Preview screen is where you spend most of your time when actively coding. It’s the dashboard for your local dev environment.

What’s on the screen

A QR code, a LAN IP detector, and three server controls:

Server	Default port	Command
Expo dev server	8081	npx expo start
API server	8000	uv run uvicorn app.main:app --reload --port 8000
Supabase	54321-54324	supabase start / supabase stop

Each has Start, Stop, and “View output” controls. Live output streams into the dashboard as the dev server runs — useful for catching bundler errors without having to switch to your VS Code terminal.

QR code

Once the Expo dev server is running, the QR code becomes scannable.

• iPhone: point your Camera app at it. Tap the notification to open in your dev client.
• Android: open your dev client first, then use its built-in scanner.

The QR code encodes a URL like exp://192.168.1.42:8081. The IP is your laptop’s LAN IP — your phone will hit your laptop directly, not Mosayic’s servers, not the public internet.

LAN IP detection

Your laptop usually has multiple network interfaces (Wi-Fi, Ethernet, virtual interfaces from Docker/VPNs). The dashboard tries to pick the right one — typically the Wi-Fi interface that’s on the same subnet as common home/office networks.

If the QR code doesn’t work because the wrong IP was picked:

1. Click Re-detect IP on the Preview screen
2. The dashboard re-runs detection on your machine
3. The new IP gets baked into your .env files and the QR code

If automatic detection keeps picking the wrong one, you can override it manually on the Project Info screen.

Port conflicts

Sometimes a port is already in use — usually because you started a server in your terminal manually, or a previous run didn’t clean up. The dashboard detects this and offers a Kill port button that runs lsof -t -i :<port> | xargs kill for you.

Note

On Windows, the equivalent is netstat -ano | findstr :<port> then taskkill /PID <pid> /F. The dashboard handles the platform-specific command for you.

EAS build history

Below the server controls, the Preview screen shows your recent EAS builds — the latest few iOS and Android dev builds with their status, link to the EAS web dashboard, and (when complete) a download link.

This is the easiest way to install a build on a new device — open the dashboard on the device’s browser, find the build, tap install.

Why is the API server here?

Most apps need a backend. The starter Mosayic gives you includes a FastAPI server with an example endpoint or two. While you develop, you run it locally — your mobile app’s EXPO_PUBLIC_API_URL points at http://<lan-ip>:8000 so the phone can reach it.

When you ship to production, that env var is overwritten with your deployed Cloud Run URL. Same code, different target.