> ## Documentation Index
> Fetch the complete documentation index at: https://docs.revyl.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Web

> Run a Next.js or static Vite app in a Revyl Web session, from a bundle Revyl builds or a preview you already deploy.

<Note>
  Web is in alpha. To add it to your organization, email [support@revyl.ai](mailto:support@revyl.ai).
</Note>

A Web app runs in a Chrome session that Revyl streams to your browser, at a desktop or
mobile-sized viewport. Revyl either serves a bundle built from your recipe or opens a preview
deployment you already host. [Web builds](/builds/web) covers both in detail; this page sets up
a project and shows recipes for Next.js and static Vite.

Prompt for your coding agent:

```text
Set up Revyl for this Web app.

Read https://docs.revyl.com/frameworks/web.md and follow it. It's the current Revyl guide for this, so prefer it over anything you remember about Revyl.

Web is in alpha: if Revyl says Web isn't enabled for my organization, stop and tell me to email support@revyl.ai. If the app already deploys previews, register those URLs with `revyl build upload --platform web --url <url> --app <web-app-id>`; otherwise add a recipe so Revyl builds a bundle.

You're done when a Revyl Web session opens the app and you've given me its link.

Ask me before anything that needs my login or approval.
```

## Set up the project

`revyl init` creates the project config but doesn't detect Web frameworks, package managers,
or preview hosts, and it doesn't create a Web app. Create the app and add a profile yourself:

```bash
revyl init -y
revyl app create --name "My Web App" --platform web
```

```yaml
build:
  profiles:
    preview:
      web:
        app_id: <web-app-id>
```

This app-ID-only profile is enough to register preview URLs and start sessions. To have Revyl
build a bundle, add your own setup commands, build commands, and output directory, as in the
examples below. A Web recipe can sit beside `ios` and `android` recipes in the same profile
without changing mobile setup.

If your app already deploys previews, keep that deploy and register each preview's HTTPS URL
after it succeeds:

```bash
revyl build upload --platform web --url "$PREVIEW_URL" --app <web-app-id>
revyl device start --platform web --app <web-app-id>
```

## Next.js

This example assumes npm and `output: "standalone"` in your Next config; adapt the commands to
your workspace and lockfile. It packages the standalone server, `.next/static`, and `public`
(when present) into `dist-revyl`, and signs in through a test-only route:

```yaml
build:
  profiles:
    preview:
      web:
        app_id: <web-app-id>
        setup_commands: [npm ci]
        build_commands:
          - npm run build
          - rm -rf dist-revyl && mkdir -p dist-revyl/.next
          - cp -RL .next/standalone/. dist-revyl/
          - cp -R .next/static dist-revyl/.next/static
          - if [ ! -d public ]; then exit 0; fi; cp -R public dist-revyl/public
        output_path: dist-revyl
        run:
          start: HOSTNAME=0.0.0.0 node server.js
          port: 3000
          secret_names: [REVYL_SIGN_IN_SECRET]
session:
  auth_bypass:
    sign_in:
      path: /revyl-login
      secret: REVYL_SIGN_IN_SECRET
```

The server must listen on `0.0.0.0` at the configured port. `REVYL_SIGN_IN_SECRET` is the
name of an encrypted organization launch variable, never its value.

Add the `/revyl-login` route only to test deployments, and have it issue a session the way your
app normally does. In the App Router, use `app/revyl-login/route.ts` (or `src/app/...`).
Folders that start with an underscore, such as `app/__e2e__/login`, are private and don't
become routes. Keep the secret out of `NEXT_PUBLIC_*` variables and browser code. The code the
route must verify is described in [Web sign-in links](/devices/session-prep#web-sign-in-links).

## Static Vite

For an npm site whose build writes `dist/index.html`:

```yaml
build:
  profiles:
    preview:
      web:
        app_id: <web-app-id>
        setup_commands: [npm ci]
        build_commands: [npm run build]
        output_path: dist
```

No `run` block is needed: Revyl serves static output, and client-side routes load on reload or
deep link. Don't add a signing secret to a static frontend. If the site needs sign-in, add the
test-only route to its backend or use a hosted preview.

## Build and open a session

```bash
revyl build --profile preview --platform web
revyl device start --platform web
```

`revyl build` runs on Revyl's build runners by default; add `--local` to build with your own
toolchain and upload the result. Check a screenshot and the signed-in account, then stop the
session with `revyl device stop --session-id <session-id>`.

Web starts don't run `session.before_script`. If a session needs test data, seed it before you
start, for example from the preview's own deploy.

## Next steps

- [Web builds](/builds/web): bundle limits, server apps, and registering previews from CI
- [Sessions](/sessions#web-sessions): start a Web session from the dashboard
- [Proof of changes](/agents/proof): have an agent exercise each pull request in a Web session